@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/Inter-Light-YxIIs4dr.woff2?v=3.17") format("woff2"), url("/assets/Inter-Light-BRG9S9oa.woff?v=3.17") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/Inter-Regular-Cs4h_3gq.woff2?v=3.17") format("woff2"), url("/assets/Inter-Regular-3DtAXn7-.woff?v=3.17") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/Inter-Medium-BzdGPsfa.woff2?v=3.17") format("woff2"), url("/assets/Inter-Medium-iAYWxOMe.woff?v=3.17") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/Inter-SemiBold-zWDGB5jF.woff2?v=3.17") format("woff2"), url("/assets/Inter-SemiBold-CBW3stBq.woff?v=3.17") format("woff");
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/Inter-Bold-BF4W6bSd.woff2?v=3.17") format("woff2"), url("/assets/Inter-Bold-Deg5LvJE.woff?v=3.17") format("woff");
}


body {
  margin: 0;
  font-family: var(--main-font-family) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-weight: var(--font-weight-400);
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: var(--font-weight-500);
  line-height: 1.2
}
.w-25-pr {
  width: 25%;
}
.w-35-pr {
  width: 35%;
}
.w-70-pr {
  width: 70%;
}
.w-90-pr {
  width: 90%;
}
.w-50-px {
  width: 50px;
}
.v-scrollable {
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding: 0 5px;
  max-height: 700px;
}
.x-scroll {
  overflow-x: auto;
}

.flex-wr {
  flex-wrap: wrap;
}

.font-bold{
  font-weight: bold;
}
.font-weight-500{
  font-weight: var(--font-weight-500);
}
.flex-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 20px 40px;
}
.flex-col {
  display: flex;
  flex-direction: column;
}
.flex-row-justify {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;
  gap: 20px;
  background: var(--background-bgcard);          
  border-top: 1px solid var(--border-borderbase);
  border-left: 1px solid var(--border-borderbase);
  border-right: 1px solid var(--border-borderbase);
  padding: 12px 16px;
  border-radius: 12px 12px 0px 0px;
}
.item-center {
  align-items: center;
}
.justify-space-between {
  justify-content: space-between;
}
.justify-center {
  justify-content: center;
}
.width-full {
  width: 100%;
}
.mt-0p{
  margin-top: 0px !important;
}
.mt-25p {
  margin-top: 25px !important;
}
.mt-14px {
  margin-top: -14px !important;
}
.mt-40p {
  margin-top: 40px !important;
}
.mb-24p {
  margin-bottom: var(--space-xl) !important;
}
.mt-20p {
  margin-top: 20px!important;
} 
.mt-15p {
  margin-top: 15px !important;
}
.ml-25p {
  margin-left: 25px;
}
.mb-25p {
  /* margin-bottom: 20px; */
}
.mb-15p {
  margin-bottom: 16px;
}
.ml-20p {
  margin-bottom: 5px;
}
.ml-20p-trigger{
  margin-left: 20px!important;
}
.ml-10p {
  margin-left: 10px !important;
}
.ml-10p-trigger {
  margin-left: 10px!important;
}
.ml-5p {
  margin-left: 4px;
}
.mb-5p {
  margin-bottom: 5px;
}
.mb-0p{
  margin-bottom: 0px !important;
}
.cursor-pointer {
  cursor: pointer;
}
.gap-30p {
  gap: 30px;
}
.gap-40p {
  gap: 40px;
}
.gap-10p {
  gap: 10px;
}
.gap-0p {
  gap: 0px;
}
.gap-5p {
  gap: 5px;
}
.p-5p {
  padding: 5px;
}
.p-10p {
  padding: 10px;
}
.pb-10p{
  padding-bottom: 10px !important;
}
.pb-20p{
  padding-bottom: 20px !important;
}
.pb-16p{
  padding-bottom: 16px !important;
}
.pt-16p{
  padding-top: 16px;
}


.f-24p {
  font-size: 24px;
}
.f-18p {
  font-size: 18px;
}
.mr-20p{
  margin-right: 20px;
}
.mr-10p{
  margin-right: 10px !important;
}
.mr-40p{
  margin-right: 40px;
}
.rotate-45 {
  transform: rotate(45deg); 
  display: block;
}
.button {
  cursor: pointer;
  &:hover {
    font-weight: bold;
  }
}
.link {
  cursor: pointer;
  color: var(--link-color);
  text-decoration: underline;
}
.container-heading {
  font-size: 24px;
  font-weight: var(--font-weight-600);
}
.title-medium {
  font-size: 20px;
  font-weight: var(--font-weight-400);
}
.p-25p {
  padding: 25px;
}
.pr-24p {
  padding-right: 20px;
}
.custom-tooltip{
  background-color: var(--pure-white);
  border: 1px solid var(--shutdown-color);
  padding:4px;
  text-align: left;

}
.center-align {
  text-align: center;

}
@media screen and (min-width: 1100px) { 
  .e2e-img{
    width: 45% !important;
    height: auto !important;
  }
  .e2e-data-center-img{
    width: 28% !important;
    height: auto !important;
  }
  .e2e-tower-img{
    width: 20% !important;
    height: auto !important;
  }
}
@media screen and (max-width: 1100px) { 
  .e2e-img{
    width: 38% !important;
    height: auto !important;
  }
  .e2e-data-center-img{
    width: 22% !important;
    height: auto !important;
  }
  .e2e-tower-img{
    width: 20% !important;
    height: auto !important;
  }
}

.right-align {
  text-align: right;

}
.align-item-end {
  align-items: flex-end;
}
.align-item-center {
  align-items: center;
}
.float-right {
  float: right;
}
.available-height {
  height: -webkit-fill-available;
}
.hyper-link{
  color: var(--content-contentbase) !important;
  cursor: pointer;
  margin-top: 16px;
  margin-bottom: 8px;
  display: inline-block;
}
.cursorpointer{
  cursor:pointer;
}

/* Optionally, change the border color for selected cells */
.MuiDataGrid-cell--selected {
  border-color: var(--active-primary-color) !important;
}
/* Apply background color to the selected row */
/* .MuiDataGrid-row.Mui-selected{
  background-color: var(--MuiDataGrid-row-bg-color) !important; 
} */
.pd-20p {
  padding: 20px;
}
.mt-20px {
  margin-top: -20px!important;
}
.mt-15p{
  margin-top: 15px!important;
}
.ml-15p{
  margin-left: 15px!important;
}
.flex-space-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.justify-content-center{
  justify-content: center;
} 
  .mrb-2 {
    margin-bottom: .5rem !important
  }
  .quickLinks,
  .servicePack {
    margin-top: var(--space-2xl);
  }

  .right-arrow-pos{
   position: absolute;
   right: 24px 
  }
  .leftMenuIcon{
    font-size: 18px !important;
  }

  .quickLinkContainer {
    margin-top: var(--space-3xl) !important;
  }
  .quickLinkContainer a{
    text-decoration: none;
  }
  
  .quickLinks h2,
  .servicePack h2,
  .servicePack2 h2 {
    font-size:32px;
    line-height: 50px;
    font-weight: var(--font-weight-300);
    margin: var(--space-none);
  }
  .launch-Links-div {
    display: flex;
    gap:6px;
    justify-content: space-between;
    align-items: center;
    margin-top: 7px;
    color:var(--content-contentsecondary);
    font-weight: var(--font-weight-400);
    text-decoration: none;
    font-size: 0.88rem;
  }
  .mrgn-top{
    margin-top: 0px;
    justify-content: flex-end !important;
    cursor: pointer;
    margin-bottom: 25px;
  }
  .launch-link-icon{
    color: var(--content-contentsecondary);
    font-size: 1.2rem !important;
  }
  
  .benefitsPackText h2,
  .PackContItemsText h3,
  .quickLinks h2,
  .servicePack h2,
  .servicePack2 h2 {
    background: var(--gradient-custom-200);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
  }
  
  
  .quickLinks p,
  .servicePack2 p, .benefitsPackText p {
    background: var(--content-contentbase);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    margin: var(--space-none);
  
  font-size: var(--heading-s-light-size);
  font-style: normal;
  font-weight: 300;
  line-height: var(--heading-s-light-lineheight);
 letter-spacing: -0.4px;
  }
  
  .quickLinksItems {
    background: var(--background-bgcard);
    padding: var(--space-xl);
    cursor: pointer;
    border-radius: var(--radius-l);
  border: var(--width-xs) solid var(--border-bordercustom);
  height:65px
  }
  
  .qiickLinksHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
  }
  
  .qiickLinksText {
    font-size: var(--size-m);
    font-style: normal;
    line-height: 24px;
    letter-spacing: 0.14px;
    color: var(--content-contentsecondary);
  }
  .iconSize32{
  font-size: 26px !important;
}
.quickLinksItems .qiickLinksHeader .myicons.iconSize32  {
  background: var(--gradient-primary);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}
.quickLinksItems:hover .myicons.iconSize32, .quickLinksItems.active .myicons.iconSize32 {
    background: black;
    background-clip: text;
}
  
  .cls-1 {
    fill: none;
  }
  
  .updirection {
    fill: var(--content-contentsecondary);
    width: 18px;
  }
  
  .headerIcon {
    width: 32px;
    height: 32px;
  }
  
  .quickLinksItems:hover,
  .quickLinksItems.active,
  .quickLinksItems:hover .qiickLinksText,
  .quickLinksItems.active .qiickLinksText,
  .servicePackContItemsDetails.add-new-domain,
  .filter-notification-num {
    color: var(--content-black);
  }
  
  .quickLinksItems:hover .updirection,
  .quickLinksItems.active .updirection {
    fill:var(--content-black);
  }
  
  .quickLinksItems:hover .headerIcon path,
  .quickLinksItems.active .headerIcon path {
    fill:var(--content-black);
  }
  
  .sortBY {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 16px;
  }
  
  .sortByOne {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-right: 16px;
  }
  
  .sortByOne h3 {
    color: var(--content-contenttertiary);
    font-size: var(--size-l);
    font-style: normal;
    font-weight: 300;
    line-height: 24px;
    margin: var(--space-none);
  }
  
  .btn.cust {
    padding: var(--space-m) var(--space-l);
    background-color: var(--background-bgcard);
    border-radius: var(--radius-pill);
    border: var(--width-xs) solid var(--border-bordercustom);
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: none;
    color: var(--content-contentsecondary);
    min-width: 180px;
  }
  
  .sortByTwo {
    display: flex;
    align-items: center;
    gap: 16px;
    border-left: var(--width-xs) solid var(--border-bordercustom);
    padding-left: 16px;
  }
  
  .sortByTwo span, .short-icon >span{
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color:var(--content-contentsecondary)
  }
  .short-icon >span> svg{fill:var(--content-contentsecondary)}
  
  
  .cust.dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
  }
  
  .servicePackCont {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .servicePackContItems {
    margin-top: 20px;
    padding-left: 0px;
  }
  
  .servicePackContItemsDetails {
    padding: var(--space-xl);
    background-color: var(--background-bgcard);
    border-radius: var(--radius-l);
    border: var(--width-xs) solid var(--border-bordercustom);
    display: flex;
    flex-direction: column;
  }
  .productIcon {
    display: flex;
    width: 60px;
    height: 60px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    position: relative;
    border-radius: var(--radius-circle);
    background: var(--background-light);
  }
  
  .favourite {
    width: 24px;
    height: 24px;
    background-color: var(--background-bgcard);
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-circle);
    border: var(--width-xs) solid var(--border-borderbase);
    cursor: pointer;
  }
  .fav {
    width: 16px;
    height: 16px;
    color:var(--content-light);
  }
  .fav.addfev  {
    color: var(--content-negative);
  }
  
  .PackContItemsHeader {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
  }
  
  .PackContItemsText {
    padding-top: var(--space-m);
  }
  
  .PackContItemsText h3 {
   
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
  }
  .add-new-domain .PackContItemsText h3{font-size: 42px;}
  
  .PackContItemsText h4 {
    font-weight:var(--text-s-semibold-weight);
  font-size:var(--text-m-semibold-size);
  line-height:var(--text-s-semibold-lineheight);
  letter-spacing:var(--text-s-semibold-letterspacing);
  text-transform: uppercase;
  color:var(--content-contentsecondary);
  }
  
  .PackContItemsText p {
    font-size: var(--text-l-light-size); 
    font-weight: var(--text-l-light-weight);
    line-height: var(--text-l-light-lineheight);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    color:var(--content-contentsecondary);
    height: 72px;
  }
  
  .PackContItemsList {
    padding-top: 16px;
  }
  .PackContItemsList ul {
    padding-left: 0px;
  }
  
  .PackContItemsList li {
    display: flex;
    justify-content: space-between;
    border-top: var(--width-xs) solid var(--border-bordercustom);
    align-items: center;
    padding: var(--space-m) var(--space-none);
    font-size: var(--size-l);
    font-style: normal;
    font-weight: 400;
    cursor: pointer;
    color: var(--content-contentsecondary)
  }
  
  .PackContItemsList p {
    margin: var(--space-none);
  }
  
  .PackContItemsList li:last-child {
    font-weight: bold;
  }
  
  .hiveHomeDrop {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    align-self: stretch;
    border-radius: var(--radius-s);
    border: var(--width-xs) solid var(--border-bordercustom);
   
  }
  .hiveHomeDrop,
  
  .quickLinksItems:hover,
  .quickLinksItems.active {
  background: var(--gradient-custom-100)!important;
  }
  .hiveHomeDrop,.repo-dropdown{
    z-index: 100000;
    position: relative;
  }
  
  .hiveHomeDrop span.rt {
    margin-right: 0;
    transform: rotate(90deg);
        transform-origin: center;
    -webkit-transition: -webkit-transform 250ms;
     transition: transform 250ms;
  }
  .hiveHomeDrop[aria-expanded="true"] .rt{
    -webkit-transform: rotate(0.75turn) translate(3%, 3%);
    -moz-transform: rotate(0.75turn) translate(3%, 3%);
    -ms-transform: rotate(0.75turn) translate(3%, 3%);
    transform: rotate(0.75turn) translate(3%, 3%);
    transform-origin: center;
    -webkit-transition: -webkit-transform 250ms;
    transition: transform 250ms;
    
  }
  .topN{margin-bottom: var(--space-m);}
  .topN li {
    border: 0;
  }
  
  
  
  .topN .dropdown > a {
    padding: var(--space-m);
    font-size:var(--text-l-semibold-size);
    line-height:var(--text-l-semibold-lineheight); 
    letter-spacing:var(--text-l-semibold-letterspacing);
    font-weight:var(--text-m-semibold-weight);
    color:var(--content-black);
  }
  .topN li a{color:inherit;}
    
   
  .topN li a:hover {
    color: var(--content-black)!important;
  }
  
  #sidenav li a[aria-expanded="true"] .rt {
    -webkit-transform: rotate(0.75turn) translate(3%, 3%);
    -moz-transform: rotate(0.75turn) translate(3%, 3%);
    -ms-transform: rotate(0.75turn) translate(3%, 3%);
    transform: rotate(0.75turn) translate(3%, 3%);
    transform-origin: center;
    -webkit-transition: -webkit-transform 250ms;
    transition: transform 250ms;
    transition-timing-function: ease-out;
    margin: var(--space-none);
  }
  .topN .dropdown-menu {
  width:100%;
  }
  .topN .dropdown-menu li :hover,
  .topN .dropdown-menu li.active,
  .topN .dropdown-menu li.selected {
    color: var(--content-contentbase) !important;
    background-color: var(--dropdown-hover) !important;
  }
  
  #sidenav li a p {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: var(--space-none);
  }
   
  .hiveHome {
    border-radius: var(--radius-s);
    padding: var(--space-m);
    border: var(--width-xs) solid var(--border-bordercustom);
    background: #FFF;
    box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
    display: flex;
    gap: .5rem;
    margin-bottom: 12px;
  }
  
  #wrapper.toggled .side-nav .static-navigation-btns {
    width: 40px;
  }
  
  #wrapper.toggled .side-nav .forFullScreen {
    display: none;
  }
  
  #wrapper.toggled .side-nav .forSmallScreen {
    display: block;
  }
  
  #wrapper .side-nav .forFullScreen {
    display: block;
  }
  
  #wrapper .side-nav .forSmallScreen {
    display: none;
  }
  
  #wrapper.toggled .side-nav li a,
  #wrapper.toggled .hiveHome span {
    overflow: hidden;
    white-space: nowrap;
  }
  
  #wrapper .side-nav li a,
  #wrapper .hiveHome span {
    overflow: hidden;
    white-space: nowrap;
  }
  
  #wrapper.toggled #sidenav,
  #wrapper.toggled .hiveHome {
    overflow: hidden;
    gap: 0;
    width: 47px;
  }
  
  #wrapper.toggled .hiveHome span {
    width: 0;
  }
  
  #wrapper.toggled .sortM {
    width: 40px !important;
  }
  
  #wrapper .hiveHome span {
    width: 100%;
  }
  
  .user-menu .dropdown-toggle::after,
  .new-item .dropdown-toggle::after{
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;}
  
  
  
  .servicePackCont2, .benefitsPackText {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
  }
  .con2 {
    display: flex;
    align-items: center;
    gap: 8px;
  }
  
  .benfits {
    margin-top: 60px;
  }
  
  .benefitsPackContainer {
    margin-top: 5px;
    position: relative;
  }
  
  .benefitsPackText h2 {
    font-size: 40px;
    line-height: 50px;
    font-weight: 300;
    margin: var(--space-none);
  }
  
  
  .benefitsPackContainer ul {
    display: flex;
    gap: 2%;
  }
  
  .benefitsPackContainer ul li {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: stretch;
    background-color: var(--background-bgcard);
    padding: var(--space-xl);
    width: 100%;
    text-align: center;
    align-items: center;
    border-radius: var(--radius-l);
    height: 230px
  }
  .templatecard ul li:hover{
    border: 1px solid var(--content-primary);
  }

  .benefitsPackContainer ul li p {
    margin: var(--space-none);
  }
  .template-washed-out-card ul li {
    opacity: 0.2;
  }

  .template-under-development {
    position: absolute;
    color: var(--content-contentbase);
    text-transform: capitalize;
    font-weight: var(--font-weight-600);
    width: 100%;
    z-index: 1;
    display: flex;
    justify-content: center;
    top: 50%;
    font-size: var(--size-3xl);
    text-align: center;
  }
  
  .servicePackContItems.dashboardOverView li.servicePackContItemsDetails {
    width: 32%;
  }
  
  .servicePackContItems.dashboardOverView {
    gap: 2%;
  }
  
  /* Rating */
  .checked {
    color: orange;
  }
  
  
  .reportsOverview {
    margin-top: 30px;
  }
  
  .reportsOverview ol {
    display: flex;
    gap: 2%;
    flex-wrap: wrap;
    padding: 0px;
    margin: 4px;
  }
  
  .reportsOverview ol li  {
    display: flex;
    padding: var(--space-l);
    flex-direction: column;
    justify-content: space-between;
    background-color: var(--background-bgcard);
    width: 20.5%;
    border-radius: var(--radius-l);
    margin-bottom: var(--space-l);
    border: var(--width-xs) solid var(--border-bordercustom);
    height: 115px
  }
  
  .reportHead{
    display: flex;
    justify-content: space-between;
  }
  .reportHeadLeft{
    display: flex;
    gap: 16px;
    justify-content: space-between;
  }
  .reportDT p{
    color:  var(--content-contentsecondary);
    font-size: var(--size-m);
    font-style: normal;
    font-weight: 400;
    line-height:  20px;
    letter-spacing:  0px;
    margin-bottom: var(--space-s);
    margin-top: 0px
  }
  .reportDT h2{
    color: var(--content-contentbase);
    font-size: 20px;
    font-style: normal;
    font-weight: var(--font-weight-600);
    line-height:  28px;
    margin: var(--space-none);
  }
  
  .reportHeadRight span {
    display: flex;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-circle);
  }
  .reportHeadRight span:hover {
   background-color: #f5eefe; 
  }
  .reportFooter{
    display: flex;
    margin-top: var(--space-l);
  }
  .reportFooter p{margin: var(--space-none);
    color:  var(--content-contentsecondary);
  font-size: var(--size-m);
  font-style: normal;
  font-weight: 400;
  line-height:20px; 
  }
  .reportHeadLeft span{
    width: 60px; border-radius: var(--radius-l);
  height: 60px; display: flex; align-items: center; justify-content: center;
  }
  .reportHeadLeft span.green{background-color: var(--background-positivesubtle);color:var(--content-positive)}
  .reportHeadLeft span.red{background-color: var(--background-negativesubtle);color:var(--content-negative)}
  .reportHeadLeft span.yellow{background-color: var(--background-noticesubtle);color:var(--content-notice)}
  .reportFooter p span{margin-left: var(--space-m);margin-right: var(--space-xs);}
  .reportFooter p span.green{ color:  var(--content-positive);}
  .reportFooter p span.red{ color:  var(--content-negative); padding-right: 4px;}
  
  .reportFooter iframe{width: 100%; height: 120px;}
  .iframePart iframe{width: 100%; height: 450px;}
  .w50{width: 49% !important;}
  .sortByTwo span.svgSpan{
    width: 45px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: var(--radius-circle);
  }
  
  .reportHeadRight {
    display: flex;
    gap: 8px;
  }
  
  
  /* modal */
  .slideOut .modal-dialog {
    max-width: 1100px;
  }
  .slideOut  .modal-dialog-slideout {
    min-height: 100%;
    margin: var(--space-none) var(--space-none) var(--space-none) auto;
  }
  .slideOut  .modal.fade .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(100%, 0)scale(1);
    transform: translate(100%, 0)scale(1);
  }
  .slideOut  .modal.fade.show .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: stretch;
    -webkit-box-align: stretch;
    height: 100%;
  }
  .slideOut  .modal.fade.show .modal-dialog.modal-dialog-slideout .modal-body {
    overflow-y: auto;
    overflow-x: hidden;
  }
  .slideOut  .modal-dialog-slideout .modal-content {
    border: 0;
  }
  .modal-title span{display: block;font-size: var(--text-m-regular-size);font-weight: var(--text-m-light-weight);color:var(--content-contentsecondary)} 
  .modalHeading{color:var(--content-contentbase);
    font-size: var(--text-xl-semibold-size);
    font-weight: var(--text-xl-semibold-weight);
    line-height: var(--text-xl-semibold-lineheight);}
  .slideOut .modal-dialog-slideout .modal-header{
    padding:var(--space-l) var(--space-xl);
    display: flex;
    align-items: center;
  }
  .modal-backdrop.show{opacity: 0.7;}
  .popUPHeader{
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .popUPHeaderLeft h2{
    color:var(--content-contentbase);
    font-size: var(--size-l);
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: var(--space-xs);
  }
  .popUPHeaderLeft p{ margin: var(--space-none);
    color: var(--content-contentsecondary);
    font-size: var(--size-m);
    font-style: normal;
    font-weight: 400;
    line-height: 16px; }
  
  
  .selectFev ul{display: flex;gap: 2%;flex-wrap: wrap;}
  .selectFev ul li{background-color: var(--background-bgcard) ;padding: var(--space-xl);border-radius: var(--radius-l);border:var(--width-xs) solid var(--border-bordercustom);display: flex;justify-content: space-between;width: 32%;margin-bottom: var(--space-l);align-items: center;}
  .starFill{width: 20px;height: 20px;fill: #c9c8c8;cursor: pointer;}
  .selectFev ul li p{margin: var(--space-none);}
  .selectFev {
    margin-top: var(--space-xl); border-bottom: var(--width-xs) solid var(--border-borderbase); padding-bottom: 6px;
  }
  .groupTab{display: flex; gap: 8px; align-items: center;}
  .selectFev h2{
    color:var(--content-contentbase);
    font-size: var(--size-l);
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: var(--space-xs);
  }
  .selectFev.bd{
    padding: var(--space-l) var(--space-l) var(--space-none); border : var(--width-xs) solid var(--border-borderbase); border-radius: var(--radius-l);
  }
  .starFill.addstar{fill: var(--content-notice);}
  .mxaTable{border: var(--width-xs) solid var(--border-bordercustom);border-bottom: 0;}
  tbody, tfoot, th, thead, tr, .table th, .table td, .table>:not(:first-child) {
    border-color: var(--border-borderbase);
  }
  .mxaTable .table{border-top: 0;font-size: var(--size-m);margin: var(--space-none);}
  .mxaTable .table th{border-top: 0;background-color: var(--mxaBG);font-size: var(--size-m);padding: var(--space-m);}
  .pin.pintop path{fill: var(--content-primary);}
  .starPlus.starpin path{fill: var(--content-primary);}
  .pin{cursor: pointer;}
  
  
  
  .notifiContainer,.favouriteContainer {
    display: flex;
    justify-content: space-between;
    padding: var(--space-m) var(--space-l);
    border-bottom: var(--width-xs) solid var(--border-bordercustom);
  }
  .notification-list,.favourite-list{max-height: 300px;
    overflow-y: auto;}
    .favourite-list{display: flex;flex-wrap: wrap;}
  .dropdown-menu.notific li {
    display: flex;
    gap: 8px;
    border-bottom: var(--width-xs) solid var(--border-bordercustom);
    padding-bottom: var(--space-m);
    padding-top: var(--space-m);
  }
  .notiIcon {
    width: 56px;
    height: 56px;
    background: var(--background-light);
    border-radius: var(--radius-circle);
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--content-contenttertiary);
  }
  .notiText {
    display: flex;
    flex-direction: column;
    color: var(--content-contentbase);
    font-size:var(--heading-xs-light-size);
  }
  .notiTextSpan {
    font-size:var(--text-m-regular-size);
    line-height: 1.1;
    color: var(--content-contenttertiary);
  }
  .notiTime {
    font-size: var(--size-m);
    font-size:var(--text-s-regular-size);
    color: var(--content-contenttertiary);
  }
  
  .dropdown-notifications-actions{text-align: center;}
  .dropdown-notifications-actions > a{display: block;color: var(--content-contenttertiary);}
  .filters{display: flex;}
  .applied-filter{display: inline-flex;justify-content: space-between;align-items: center;}
  .badge .myicons{font-size: var(--size-l);}
  .badge.badge-dot {
    display: inline-block;
    margin: var(--space-none);
    padding: var(--space-none);
    width: 0.5rem;
    height: 0.5rem;
    border-radius: var(--radius-circle);
    vertical-align: middle;
    background-color: var(--background-primary);
  }
  .bg-primary-light{background-color: var(--background-primarylight) !important;
    color: var(--content-primary) !important;
  }
  .notific .dropdown-item .dropdown-notifications-archive {
    visibility: hidden;
  }
  .notific .dropdown-item:hover .dropdown-notifications-archive {
    visibility: visible;
  }
  
  .dropdown-menu.notific,.favourite-dropdown {
    width: 400px; max-width: 400px;
  }
  
  
  ul.favourite-list li:nth-child(odd) {
    border-right: var(--width-xs) solid var(--border-bordercustom);
  }
  ul.favourite-list li {
    width: 49.7%;
    min-height: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom: var(--width-xs) solid var(--border-bordercustom);
  }
  ul.favourite-list li a {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: var(--content-contentbase) !important;
    gap: 8px;
  }
  .favourite-list.favourite-list-view{
    flex-wrap: nowrap;
    flex-direction: column;
    }
    .favourite-list.favourite-list-view li{
        flex-wrap: nowrap;
        width:100%;
        justify-content: flex-start;
        text-align: left;
        height:50px;max-height:50px;min-height:50px;
        }
        .favourite-list.favourite-list-view li a{flex-direction:row;align-items: flex-start; justify-content: flex-start;}
  .notificationHeading,.favouriteHeading{font-size: var(--heading-s-light-size);color:var(--content-contentsecondary)}
  .notificationHeading, .notificationIcon {
    color: var(--content-contentsecondary);
    align-items: center;
      display: flex;
  }
  .sortByTwo span:hover, .short-icon >span:hover, .btn-icon:hover,.sortByTwo span.active{
  background: var(--nav-icon-hover);
  border-radius: var(--radius-circle);}
  
  
  .sortByTwo span.active{color:var(--content-primary);}
  
    .productCount {
        color: #dfdede;
    }
    .dropdown-menu.viewDrop li{padding: var(--space-none);
      margin: var(--space-none);
      border-radius: var(--radius-none);
    }
    .dropdown-menu.viewDrop li a.dropdown-item{border-radius: var(--radius-none);padding: var(--space-s) var(--space-l);}
  
    .benefitsPackContainer .PackContItemsText h3, .dashboardOverView .PackContItemsText h3{color: var(--content-contentsecondary);background: transparent;-webkit-text-fill-color: var(--content-contentsecondary);}
  
    .likeSvg.liked{color: var(--content-primary);} 
  
    .sortM li.active{
        border-radius: var(--radius-s);
        border: var(--width-xs) solid var(--border-bordercustom);
        background: #FFF;
        box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
    }
    #sidenav.sortM li.active a{
        background: linear-gradient(87deg, #7549F2 5.56%, #DE53F7 98.52%);
        background-clip: text;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        font-weight: 500;
    }
  
    #sidenav.sortM li.active a .leftMenuIcon path{
        fill: var(--content-primary);
    }
    .hiveHome svg path{ fill:  var(--content-primary);}
    .dropdown.user-menu{width: 150px;}
    .dropdown.user-menu a{width: 100%;}
    .dropdown.user-menu > a:hover{background-color: transparent !important;}
    .dropdown.user-menu a p{margin: var(--space-none); color: var(--content-primary); font-weight: bold; font-size: var(--size-m);    padding: 0 0 0 15px;}
    .dropdown.user-menu a p span{display:block;margin: var(--space-none);color: var(--content-contentsecondary);font-weight: normal;font-size: 12px;text-transform:uppercase;padding-top: var(--space-xs);}
  
    .dropdown.user-menu  .dropdown-item{display: flex;gap:var(--space-s)}
  
    .form-control.datepik {
        padding: var(--space-m) var(--space-l);
        background-color: var(--background-bgcard);
        border-radius: var(--radius-pill);
        border: var(--width-xs) solid var(--border-bordercustom);
        box-shadow: none;
        color: var(--content-contentsecondary);
        min-width: 200px;
        min-height: 50px;
    }
  
  /* Dark Mode */
  
  
  .dark-mode .leftMenuIcon path {
    fill: var(--sidenav-link-color);
  }
  
  .dark-mode .PackContItemsList li svg path {
    fill: #b3b3b3
  }
  
  
  /* Avatar */
  .rounded-circle{
    border-radius: 50% !important;
  }
  
  .avatar {
    position: relative;
    width: 2.5rem;
    height: 2.5rem;
    cursor: pointer;
  }
  .avatar img {
    width: 100%;
    height: 100%;
  }
  .avatar .avatar-initial {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f0eff0;
    font-size: 0.9375rem;
    color: var(--content-contentsecondary);
  }
  .avatar.avatar-md .avatar-initial {
    line-height: 1.3;
  }
  .avatar.avatar-online:after, .avatar.avatar-offline:after, .avatar.avatar-away:after, .avatar.avatar-busy:after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 3px;
    width: 8px;
    height: 8px;
    border-radius: var(--radius-circle);
    box-shadow: 0 0 0 2px #fff;
  }
  .avatar.avatar-online:after {
    background-color: #56ca00;
  }
  .avatar.avatar-offline:after {
    background-color: #8a8d93;
  }
  .avatar.avatar-away:after {
    background-color: #ffb400;
  }
  .avatar.avatar-busy:after {
    background-color: #ff4c51;
  }
  
  .pull-up {
    transition: all 0.25s ease;
  }
  .pull-up:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.25rem 0.625rem rgba(46, 38, 61, 0.2);
    z-index: 30 !important;
    border-radius: var(--radius-circle);
  }
  
  .avatar-xs {
    width: 1.5rem;
    height: 1.5rem;
  }
  .avatar-xs .avatar-initial {
    font-size: 0.625rem;
  }
  .avatar-xs.avatar-online:after, .avatar-xs.avatar-offline:after, .avatar-xs.avatar-away:after, .avatar-xs.avatar-busy:after {
    width: 0.3rem;
    height: 0.3rem;
    right: 1px;
  }
  
  .avatar-sm {
    width: 2rem;
    height: 2rem;
  }
  .avatar-sm .avatar-initial {
    font-size: 0.75rem;
  }
  .avatar-sm.avatar-online:after, .avatar-sm.avatar-offline:after, .avatar-sm.avatar-away:after, .avatar-sm.avatar-busy:after {
    width: 0.4rem;
    height: 0.4rem;
    right: 2px;
  }
  
  .avatar-md {
    width: 3rem;
    height: 3rem;
  }
  .avatar-md .avatar-initial {
    font-size: 1.125rem;
  }
  .avatar-md.avatar-online:after, .avatar-md.avatar-offline:after, .avatar-md.avatar-away:after, .avatar-md.avatar-busy:after {
    width: 0.6rem;
    height: 0.6rem;
    right: 4px;
  }
  
  .avatar-lg {
    width: 3.5rem;
    height: 3.5rem;
  }
  .avatar-lg .avatar-initial {
    font-size: 1.5rem;
  }
  .avatar-lg.avatar-online:after, .avatar-lg.avatar-offline:after, .avatar-lg.avatar-away:after, .avatar-lg.avatar-busy:after {
    width: 0.7rem;
    height: 0.7rem;
    right: 5px;
  }
  
  .avatar-xl {
    width: 4rem;
    height: 4rem;
  }
  .avatar-xl .avatar-initial {
    font-size: 1.875rem;
  }
  .avatar-xl.avatar-online:after, .avatar-xl.avatar-offline:after, .avatar-xl.avatar-away:after, .avatar-xl.avatar-busy:after {
    width: 0.8rem;
    height: 0.8rem;
    right: 6px;
  }
  
  .avatar-group .avatar img,
  .avatar-group .avatar .avatar-initial {
    border: var(--width-m) solid var(--border-borderbase);
  }
  .avatar-group .avatar .avatar-initial {
    background-color: var(--background-light);
  }
  .avatar-group .avatar:hover {
    z-index: 30 !important;
    transition: all 0.25s ease;
  }
  
  .avatar-group .avatar:nth-child(1) {
    z-index: 8;
  }
  
  .avatar-group .avatar:nth-child(2) {
    z-index: 7;
  }
  
  .avatar-group .avatar:nth-child(3) {
    z-index: 6;
  }
  
  .avatar-group .avatar:nth-child(4) {
    z-index: 5;
  }
  
  .avatar-group .avatar:nth-child(5) {
    z-index: 4;
  }
  
  .avatar-group .avatar:nth-child(6) {
    z-index: 3;
  }
  
  .avatar-group .avatar:nth-child(7) {
    z-index: 2;
  }
  
  .avatar-group .avatar {
    transition: all 0.25s ease;
    margin-left: -0.65rem;
  }
  .avatar-group .avatar:first-child {
    margin-left: var(--space-none) !important;
  }
  .avatar-group .avatar-xs {
    margin-left: -0.5rem !important;
  }
  .avatar-group .avatar-sm {
    margin-left: -0.6rem !important;
  }
  .avatar-group .avatar-md {
    margin-left: -0.8rem !important;
  }
  .avatar-group .avatar-lg {
    margin-left: -1rem !important;
  }
  .avatar-group .avatar-xl {
    margin-left: -1.1rem !important;
  }
  
  
  /* -/ */
  .text-bg-light{background-color: var(--background-light);color:var(--content-contentsecondary)}
  .bg-danger,.text-bg-danger {
    background-color: var(--background-negative) !important;
  }
  .bg-success,.text-bg-success {
    background-color: var(--background-positive) !important;
  }
  .bg-warning,.text-bg-waring{ background-color: var(--background-notice) !important;}
  .bg-inactive,.text-bg-inactive{ background-color: var(--background-disabled) !important;
    color: var(--content-disabled);}
  .k-table-td .btn{border:none; box-shadow: none;}
  .k-table-td .badge{line-height: normal;}
  
  .btn.filters,
  .btn.summary,
  .btn.link,
  .btn.sort,
  .btn.row-limit,
  .btn.custom-columns,
  .btn.preview{width:48px; height:48px; align-items: center;background-color:var(--background-bgcard);border: var(--width-xs) solid var(--border-bordercustom)}
  .btn.preview{position: absolute;
  right: var(--space-l);
  bottom: 37px;}
  .btn.filters{border-color:var(--primary-300);color:var(--content-primary);}
  .btn.summary{border-color:var(--secondary-200); color:var(--secondary-400);}
  .btn.link{border-color:var(--cyan-200);color:var(--cyan-300);}
  .btn.sort{border-color:var(--purple-300);color:var(--purple-400);}
  .btn.row-limit{border-color:var(--neutral-300);color:var(--neutral-400);}
  .btn.custom-columns{border-color:var(--yellow-300);color:var(--yellow-500);}
  
  .btn.filters.disabled,
  .btn.summary.disabled,
  .btn.link.disabled,
  .btn.sort.disabled,
  .btn.row-limit.disabled,
  .btn.custom-columns.disabled,
  .btn.preview.disabled{background:var(--background-disabled);border-color:var(--border-disabled);color:var(--content-disabled)}
  
  .btn.filters:hover,
  .btn.summary:hover,
  .btn.link:hover,
  .btn.sort:hover,
  .btn.row-limit:hover,
  .btn.custom-columns:hover,
  .btn.preview:hover{box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);}
  .card-container{display: flex;
    flex-direction: column;
    gap: 64px;}
    .item{position: relative;margin-bottom: var(--space-6xl) }
  .linked-div{z-index:-1; text-align: center;position: absolute;height: 130px;display: flex;align-items: center;justify-content: center;top: -130px;width: 100%;}
    .linked-div:before{ content: "";
    position: absolute;
    width: 1px;
    height: 100%;
    border: var(--width-xs) dashed var(--background-transparent);
    top: 0;
    left: 50%;}
    .linked-div .btn{box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.05);}
    .linked-div.filters:before{border-color:var(--primary-300);}
  .linked-div.summary:before{border-color:var(--secondary-200);}
  .linked-div.link:before{border-color:var(--cyan-200);}
  .linked-div.sort:before{border-color:var(--purple-300);}
  .linked-div.row-limit:before{border-color:var(--neutral-300);}
  .linked-div.custom-columns:before{border-color:var(--yellow-300);}
  .create-report-options{list-style-type: none;display: flex;}
  .create-report-options li:not(:first-child){border-left:var(--width-xs) solid var(--border-borderbase)}
    .chart-type-section{overflow: hidden;position:relative;}
    .chart-type-list-wrapper {
      display: flex;
      align-items: center;
      position: relative;
      overflow-x: hidden; 
      width: 100%; 
      justify-content: start;
      padding: var(--space-2xl);
  }
  
  .chart-type-list {
      display: flex;
      transition: transform 0.3s ease; 
      list-style: none;
      padding: var(--space-none);
      margin: var(--space-none);
      flex: 0 0 auto;
      
  }
  
  .chart-type-list-item {
      flex: 0 0 auto; 
      text-align: center;
      width: 100px;
      display: flex;
      flex-direction: column; padding: var(--space-xs) var(--space-none);
  }
  .chart-type-list-item:not(:last-child) {border-right:var(--width-xs) solid var(--border-borderbase)}
  .chart-type-icon{
    width: 24px;
    height: 24px;
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--content-contentsecondary);
    margin: var(--space-none) auto;
    margin-bottom: var(--space-xs);
  }
  .chart-type-list-item p{margin: var(--space-none);}
  
  .chart-type-list-item.disabled .chart-type-icon,
  .chart-type-list-item.disabled p{opacity: 0.3;cursor:not-allowed;}
  .chart-type-list-item:focus,
  .chart-type-list-item:active,
  .chart-type-list-item.active{
    border-bottom:var(--width-m) solid var(--border-primary);
    background-color: var(--background-light);
    }
  button.prev-button,
  button.next-button {
      background: none;
      border: none;
      font-size: var(--size-xl);
      color: var(--content-white);
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      z-index: 1;
      padding: var(--space-none) 10px;
      cursor: pointer;
      background-color: var(--overlay-overlay50);
      border-radius: var(--radius-circle);
      width: 40px;
      height: 40px;
      text-align: center;
  }
  
  button.prev-button {
      left: var(--space-m);
  }
  
  button.next-button {
      right: var(--space-m);
  }
  
  button.prev-button:hover,
  button.next-button:hover {
      opacity: 1;
  }
   
  .visualization-section{transition: all 0.4s; position: relative; margin-bottom: var(--space-l);}
  .visual-settings{
    opacity: 0;display: none; 
  }
    .visual-settings.show{   -webkit-transform: translate(0, 0);transform: translate(0, 0);flex-flow: column;right:0; left: auto!important;opacity: 1;display: block;}
   
  .settings-section{display: flex;align-items: center;justify-content:space-between;border-radius:var(--radius-l);padding:var(--space-l); background-color: var(--background-bgcard);height: 90px;border:var(--width-xs) solid var(--border-bordercustom)}
  
  .graphic-view .row,.graphic-view .row .col-lg-4,.graphic-view .row .col-lg-8,.graphic-view,.list-view-table{height:100%}
  
  
    /* Swtiches */
    .material-switch > input[type="checkbox"] {
        display: none;   
    }
    
    .material-switch > label {
        cursor: pointer;
        height: 0px;
        position: relative; 
        width: 50px;  
    }
    
    .material-switch > label::before {
        background: rgb(0, 0, 0);
        border-radius: var(--radius-s);
        content: '';
        height: 16px;
        margin-top: -8px;
        position:absolute;
        opacity: 0.2;
        transition: all 0.4s ease-in-out;
        width: 40px;
    }
    .material-switch > label::after {
        background: rgb(255, 255, 255);
        border-radius: var(--radius-l);
        box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
        content: '';
        height: 24px;
        left: -4px;
        margin-top: -8px;
        position: absolute;
        top: -4px;
        transition: all 0.3s ease-in-out;
        width: 24px;
    }
    .material-switch > input[type="checkbox"]:checked + label::before {
        background: inherit;
        opacity: 0.5;
    }
    .material-switch > input[type="checkbox"]:checked + label::after {
        background: inherit;
        left: 20px;
    }
    .material-switch .label-primary {
        background-color: var(--background-primary);
    }
    /* /Swtiches */
    #repositorytabsContent{height:100%;transition: all 0.4s;}
    #repositorytabsContent .tab-pane{height:calc(100% - 140px);padding: var(--space-none) var(--space-none) var(--space-none) var(--space-l);overflow-y: auto;min-height:540px}
  
   /* Dividers */
   .divider {
    display: block;
    text-align: center;
    margin: var(--space-l) var(--space-none);
    overflow: hidden;
    white-space: nowrap;
  }
  .divider .divider-text {
    position: relative;
    display: inline-block;
    font-size: 0.9375rem;
    padding: var(--space-none) 1rem;
    color: var(--content-contentsecondary);
  }
  .divider .divider-text i {
    font-size: 1rem;
  }
  .divider .divider-text i::before {
    font-size: 1rem;
  }
  .divider .divider-text:before, .divider .divider-text:after {
    content: "";
    position: absolute;
    top: 50%;
    width: 100vw;
    border-top: var(--width-xs) solid rgba(46, 38, 61, 0.2);
  }
  .divider .divider-text:before {
    right: 100%;
  }
  .divider .divider-text:after {
    left: 100%;
  }
  .divider.text-start .divider-text {
    padding-left: 0;
  }
  .divider.text-end .divider-text {
    padding-right: 0;
  }
  .divider.text-start-center .divider-text {
    left: -25%;
  }
  .divider.text-end-center .divider-text {
    right: -25%;
  }
  .divider.divider-dotted .divider-text:before, .divider.divider-dotted .divider-text:after, .divider.divider-dotted:before, .divider.divider-dotted:after {
    border-style: dotted;
    border-width: 0 var(--width-xs) var(--width-xs);
    border-color: rgba(46, 38, 61, 0.2);
  }
  .divider.divider-dashed .divider-text:before, .divider.divider-dashed .divider-text:after, .divider.divider-dashed:before, .divider.divider-dashed:after {
    border-style: dashed;
    border-width: 0 var(--width-xs) var(--width-xs);
    border-color: rgba(46, 38, 61, 0.2);
  }
  .divider.divider-vertical {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin: unset;
  }
  .divider.divider-vertical:before, .divider.divider-vertical:after {
    content: "";
    position: absolute;
    left: 50%;
    border-left: var(--width-xs) solid var(--border-borderbase);
  }
  .divider.divider-vertical:before {
    bottom: 50%;
    top: 0;
  }
  .divider.divider-vertical:after {
    top: 50%;
    bottom: 0;
  }
  .divider.divider-vertical.divider-dashed:before, .divider.divider-vertical.divider-dashed:after {
    border-width: var(--width-xs) var(--width-xs) var(--width-xs) 0;
  }
  .divider.divider-vertical.divider-dotted:before, .divider.divider-vertical.divider-dotted:after {
    border-width: var(--width-xs) var(--width-xs) var(--width-xs) 0;
  }
  .divider.divider-vertical .divider-text {
    background-color: var(--background-transparent);
    z-index: 1;
    padding: var(--space-s);
  }
  .divider.divider-vertical .divider-text:before, .divider.divider-vertical .divider-text:after {
    content: unset;
  }
  .divider.divider-vertical .divider-text .badge-divider-bg {
    padding: 0.313rem 0.29rem;
    border-radius: var(--radius-circle);
    font-weight: 500;
    font-size: 0.825rem;
  }
  
  .divider.divider-secondary.divider-vertical:before, .divider.divider-secondary.divider-vertical:after,
  .divider.divider-secondary .divider-text:before,
  .divider.divider-secondary .divider-text:after {
    border-color: #8a8d93;
  }
  
  .divider.divider-success.divider-vertical:before, .divider.divider-success.divider-vertical:after,
  .divider.divider-success .divider-text:before,
  .divider.divider-success .divider-text:after {
    border-color: #56ca00;
  }
  
  .divider.divider-info.divider-vertical:before, .divider.divider-info.divider-vertical:after,
  .divider.divider-info .divider-text:before,
  .divider.divider-info .divider-text:after {
    border-color: #16b1ff;
  }
  
  .divider.divider-warning.divider-vertical:before, .divider.divider-warning.divider-vertical:after,
  .divider.divider-warning .divider-text:before,
  .divider.divider-warning .divider-text:after {
    border-color: #ffb400;
  }
  
  .divider.divider-danger.divider-vertical:before, .divider.divider-danger.divider-vertical:after,
  .divider.divider-danger .divider-text:before,
  .divider.divider-danger .divider-text:after {
    border-color: #ff4c51;
  }
  
  .divider.divider-dark.divider-vertical:before, .divider.divider-dark.divider-vertical:after,
  .divider.divider-dark .divider-text:before,
  .divider.divider-dark .divider-text:after {
    border-color: #4b4b4b;
  }
  
  .divider.divider-gray.divider-vertical:before, .divider.divider-gray.divider-vertical:after,
  .divider.divider-gray .divider-text:before,
  .divider.divider-gray .divider-text:after {
    border-color: rgba(46, 38, 61, 0.5);
  }
   /* -/Divivders */
  
   /* toggler for grid and chart mode */
  
  .toggle {position: relative;display: block;width: 63px;height: 34px;cursor: pointer;-webkit-tap-highlight-color: transparent;-webkit-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0);margin:var(--space-none) var(--space-m)}
  .toggle:before {
    content: "";
    text-align: right;
    position: relative;
    top: 7px;
    left: 3px;
    width: 50px;
    height: 22px;
    font-size: 10px;
    display: block;
    border-radius: var(--radius-pill);
    -webkit-transition: background .2s ease;
    -o-transition: background .2s ease;
    transition: background .2s ease;
    padding: var(--space-2xs) var(--space-s);
    background: #00000045;
    border: 1px solid var(--border-borderbase);
    }
  .toggle span {
    position: absolute;
    top: 2px;
    left: 0;
    width: 28px;
    height: 28px;
    display: block;
    background: #fff;
    border-radius: var(--radius-circle);
    -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
    -webkit-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
    }
    .toggle span:before {
      font-family: 'myicons', sans-serif;
      content: '\e98a';
      position: absolute;
      display: block;
      margin: var(--space-none);
      width: 32px;
      height: 32px;
      background: var(--background-inverse);
      border-radius: var(--radius-circle);
      -webkit-transform: scale(1);
      -ms-transform: scale(1);
      transform: scale(1);
      opacity: 1;
      pointer-events: none;
      color: var(--content-contentprimaryinverse);
      text-align: center;
      line-height: inherit;
      }
  
  #visualrep:checked + .toggle span {
  background: var(--background-inverse);
  -webkit-transform: translateX(31px);
  -ms-transform: translateX(31px);
  transform: translateX(31px);
  -webkit-transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
  -o-transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
  transition: all 0.2s cubic-bezier(0.8, 0.4, 0.3, 1.25), background 0.15s ease;
  -webkit-box-shadow: 0 3px 8px rgba(241, 188, 49, 0.7);
  box-shadow: 0 3px 8px rgba(241, 188, 49, 0.7); }
  #visualrep:checked + .toggle span:before {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
    font-family: 'myicons', sans-serif;
    content:'\e9d8';
    background: var(--background-inverse);
    color: var(--content-contentprimaryinverse);padding:var(--space-none) var(--space-none) var(--space-none) 1px }
    .visualrep-switch{
      color:var(--content-contenttertiary);
      min-width: 208px;
      }
    .visual-button-section{
      padding:0 var(--space-s); display: flex;gap:var(--space-s)}
    .visualrep-switch span.active{color:var(--content-contentbase);}
    /* -/toggler for grid and chart mode */
    .filters-section,.filters-ifapplied{display: none;border-bottom: var(--width-xs) solid var(--border-borderbase);
      padding: var(--space-s) var(--space-l);box-shadow: 0 3px 6px -3px #0000001c;}
    .filter-notification-num {text-align: center;
      display: -webkit-box;
      display: -webkit-flex;
      display: -ms-flexbox;
      display: flex;
      -webkit-flex-direction: row;
      -ms-flex-direction: row;
      flex-direction: row;
      -webkit-box-flex-wrap: wrap;
      -webkit-flex-wrap: wrap;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-align-content: center;
      -ms-flex-line-pack: center;
      align-content: center;
      -webkit-align-items: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      box-sizing: border-box;
      font-weight: 500;
      font-size: 0.75rem;
      min-width: 20px;
      line-height: 1;
      padding: var(--space-none) 6px;
      height: 20px;
      border-radius: var(--radius-pill);
      z-index: 1;
      -webkit-transition: -webkit-transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
      transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
      background-color: var(--background-primary);
    }


    img, svg {
      vertical-align: middle;
  }
  .align-items-center{
    align-items: center !important;
  }
  .justify-content-between{
    justify-content: space-between !important;
  } 
  .d-flex{
    display: flex !important;
  }
  .m-0{
    margin: 0 !important;
  }
  .mtop-0{
    margin-top: 0 !important;
  }

  /* hearder icons CSS */
  /* Custom style.css */
:root {
    --regular: 16px;
    --medium: 17px;
    --large: 19px;
    --small: 15px;
}


@media screen and (max-width: 1600px) {
    :root {
        --regular: 16px;
        --medium: 18px;
        --large: 20px;
        --small: 14px;
    }
}

@media screen and (max-width: 1440px) {
    :root {
        --regular: 16px;
        --medium: 17px;
        --large: 18px;
        --small: 14px;
    }
}

/* @media screen and (max-width: 1280px) {
    :root {
        --regular: 13px;
        --small: 12px;
        --medium: 14px;
        --large: 15px;
    }
} */



html.large_scale, body.large_scale{font-size: var(--large);}
html.middle_scale, body.middle_scale {font-size: var(--medium);}
html.small_scale, body.small_scale {font-size: var(--small);}
html.regular_scale, body.regular_scale {font-size: var(--regular);}

.large_scale .btn-sm .myicons{font-size:1.3rem}
.middle_scale .btn-sm .myicons{font-size:1.2rem }
.regular_scale .btn-sm .myicons{font-size:1.1rem }
.small_scale .btn-sm .myicons{font-size:1rem}
html, body{width:100%; height:100%; font-size: var(--regular)}
html.regular_scale, body.regular_scale {
    font-size: var(--regular);
}
*:focus {outline: 0px solid var(--border-primary) !important;box-shadow: none !important}

h4{font-size: 1.2em;color:var(--content-contentbase);}
a {cursor: pointer;text-decoration: none;}
a:hover {text-decoration: none;}
ul,ol,li {margin: 0;padding: 0;list-style: none;}
svg:focus {outline: none;}
b, strong{font-family: var(--family-inter);font-weight: bold;}
.heading-2{font-family: var(--heading-font);}
.heading-3{font-family: var(--heading-font);font-size: 1.1rem;}
.container-fluid{padding:0}
.text-color{color: var(--content-contentbase);}
.side-nav{margin-left:0; position:fixed; left:0;top:64px;min-height:100vh;-webkit-transition:300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;-moz-transition:300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;-o-transition:300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;transition:300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;box-shadow:rgba(0, 0, 0, 0.2) 0px 8px 10px -5px, rgba(0, 0, 0, 0.14) 0px 16px 24px 2px, rgba(0, 0, 0, 0.12) 0px 6px 30px 5px;
  box-shadow:rgba(0, 0, 0, 0.2) 0px 8px 10px -2px;
  z-index:1029;width:16em; background-color: var(--background-base);
  border-right:var(--width-xs) solid var(--border-bordercustom)}
.sidebar-heading{padding:0.5rem 1rem; font-size:1.5625em; z-index:3; position:relative;}
#page-content-wrapper{width:100%; min-width:0;position: absolute;right:0;top:64px;transition: 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
#wrapper.toggled #page-content-wrapper{width: calc(100% - 5em);}
#wrapper.toggled .side-nav{margin-left: 0em;width: 5em;} 
#wrapper.toggled .side-nav.customFilters{margin-left: 0em;width: 15em;} 
#wrapper.toggled #sidenav .collapse{position: absolute;left: 58px;top: 0;background: var(--background-base);border: var(--width-xs) solid var(--border-borderbase);border-radius: var(--radius-xs);overflow: initial !important;} 
#wrapper.toggled #sidenav .collapse li > .collapse{right: initial;left: 100%;}
#wrapper.toggled #sidenav .accordion-item:hover > a + ul, #wrapper.toggled #sidenav .accordion-item > a + ul > li:hover > a + ul{display: block;} 

#wrapper.toggled #sidenav .accordion-item a > span.float-end{position: absolute;right: -12px;top: 13px;}

#wrapper:not(.toggledFilter.toggled) .side-nav.customFilters{margin-left: -20em;z-index: 1;}
#wrapper.toggledFilter.toggled .side-nav.customFilters{margin-left: 5em;}
#wrapper.toggledFilter:not(.toggled) .side-nav.customFilters{margin-left: 16em;}
#wrapper.toggledFilter.toggled #page-content-wrapper{width: calc(100% - 20em);}
#wrapper.toggledFilter:not(.toggled) #page-content-wrapper{min-width: 0; width: calc(100% - 32em);}
.filterHeading{margin: 0;padding: 0;font-size: 16px;}



@media (min-width: 980px) {.side-nav{top: 0;padding: 8px 16px 16px;}
#page-content-wrapper{top: 0;}
}
#menu-toggle{display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  background-color: transparent;
  outline: 0px;
  border: 0px;
  margin: 0px 16px 0px -12px;
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  text-decoration: none;
  text-align: center;
  flex: 0 0 auto;
  border-radius: 50%;
  box-shadow:none;
  overflow: visible;
  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  color: inherit;
  padding: 12px;
  font-size: 1.75rem;}

  
#topnav-toggle .myicons{background-image:none ;font-size: 1.2em;}
.navbar-toggler{color:var(--content-contentsecondary)!important;border-color:rgba(255,255,255,.1);padding:10px!important;border-radius:var(--radius-circle)!important;box-shadow:none!important}

.logo > a,.logo > a:hover{color:var(--hcl-logo)!important; display: block;}
.logo a svg{width:112px;}
/*Side Nav */
#sidenav{overflow-y: auto;position: relative; padding-bottom:10px; height:calc(100vh - 210px)}

#sidenav li a, .quick-link li a{display: flex;padding: var(--space-m);color: var(--content-contentbase);font-size: 0.9rem;font-style: normal;font-weight: 300;line-height: 24px;align-items: center;}
.small_scale #sidenav li a, .small_scale .quick-link li a{font-size: var(--body-2);}
.quick-link li li a{padding: var(--space-none);border: 0;}
.quick-link li.active > a{font-family: var(--heading-font);letter-spacing: 0.2px;}

#sidenav li a>svg{vertical-align: middle;margin-right: 4px;}
#sidenav li a>img{vertical-align: middle;margin-right:5px;}

#sidenav .collapse.show{background: var(--sidenav-active-bg);}
#sidenav .collapse.show li:not(:last-child){border-bottom: 0;}
#sidenav li a > span{transform-origin: center;-webkit-transition: -webkit-transform 250ms;transition: transform 250ms;transition-timing-function: ease-out;margin-right: 0;}
#sidenav li a.myreport > svg{color:var(--primary)}
#sidenav >li>ul>li >ul {background: var(--sidenav-active-bg);}
#sidenav >li>ul>li >ul >li:not(:last-child){border-bottom:1px solid var(--sidenav-border-color)!important}

#sidenav .accordion-item{border:0; box-shadow:none; border-radius: var(--radius-s);background-color: var(--background-transparent);}
#sidenav li.accordion-item a{border-radius: var(--radius-s);}
#sidenav li a[aria-expanded=true]{background: var(--background-primarylight);border-radius: var(--radius-s) var(--radius-s) var(--radius-none);}
#sidenav .accordion-item.active{
border: var(--width-xs) solid var(--border-bordercustom);
background: var(--background-base);
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.12);
z-index: 1;
position: relative;
}
#sidenav .accordion-item.active > a{
  color: var(--content-primary);
}


.static-navigation-btns{padding: var(--space-l) var(--space-none);border-top: var(--width-xs) solid var(--border-borderbase);z-index: 1;position: absolute;width: calc(100% - 40px);bottom: 0; background-color: var(--background-base);height:57px}

.static-navigation-btns .help-button { position:relative;display: block;height:36px; line-height:36px;border-radius:var(--radius-m);text-align:left;background:#ddd;color:#000;padding:0 1rem; margin: 1rem;width:calc(100% - 2rem)}
.static-navigation-btns .help-button :not(:first-child){margin-top: 8px;}
.static-navigation-btns .help-button:hover {background: var(--primary);color:#fff!important}
.static-navigation-btns a.notification-btn span {width:20px; height:20px;line-height:16px; font-size:var(--body-3);font-weight:600; background:#fff; border-radius:var(--radius-circle); color:var(--content-primary);display:inline-block;text-align:center;font-style:normal;padding:2px 0 0 0;box-sizing:border-box;position:absolute;right:15px; top:50%; margin-top: -10px;}
.navbar-nav {
  display: flex;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.main-header {background: #fff;height: 64px;}
.navbar {display:flex;justify-content: flex-start;background-color: var(--background-base);
padding: var(--letterspacing-none) var(--space-xl) var(--letterspacing-none);
border-bottom: var(--width-xs, 1px) solid var(--border-bordercustom);}

@media (min-width:992px){
  .navbar {min-height: 64px;height: 64px;}
}
@media (max-width:992px){
  #topNav .navbar-nav{
    display: flex;flex-direction: row;padding:0 var(--space-l);justify-content: flex-end;}
  .side-nav{top:54px}
#page-content-wrapper{top:54px}
}
nav.navbar >h1{font-size: var(--heading-5);color: var(--content-primary);display: inline-block;font-weight: 600;vertical-align: top;line-height: 63px;margin: 0;font-family: var(--family-inter);}

.input-group.top-search{width: 46px;cursor: pointer;display: flex;flex-direction: row-reverse;transition: 0.5s all ease-in-out;-webkit-transition: 0.5s all ease-in-out;background: transparent;border: 1px solid var(--border-borderbase);overflow: hidden;margin-right: 8px;}
.input-group.top-search.toggleSearch{width: 230px;}
.top-search {width:300px;margin:0.8rem 0;padding:0;height:39px;line-height:39px;
  position: relative;
  border-radius: var(--radius-s);
  color:var(--content-contentsecondary);
}	
.top-search.input-group input {
  padding-left: 10px;
}
.topOrganizationList > .k-floating-label-container{margin-top: -20px;  min-width: 200px;  margin-left: 16px;}
.top-search input {
  border:0;
  background:none;
  padding:0;
  outline:none;
  width:10%;
  border-radius: var(--radius-none);
  height:100%;
   -webkit-transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  -webkit-animation-name: mui-auto-fill-cancel;
  animation-name: mui-auto-fill-cancel;
  -webkit-animation-duration: 10ms;
  animation-duration: 10ms;color: var(--content-contentsecondary)!important;
}
  .top-search input::placeholder {color:var(--content-contentsecondary);opacity: 0.5;}
.top-search input:focus{background:transparent;}
.top-search .input-group-text{border: none;background: transparent;color: inherit;height: 36px;padding: 0 11px 0 12px;}
.small_scale .top-search .input-group-text,.small_scale .top-search input{height:inherit}
.notification-box a {position:relative;
}
.notification-box a svg{width:26px!important; height:26px!important}
.notification-box:hover {text-decoration:none;}
.notification-box:hover i {box-shadow:3px 4px 4px #ddd; }
.notification-num {position: absolute; top:3px;  right:6px; text-align: center;width:20px;color:var(--content-white);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-flex-wrap: wrap;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  box-sizing: border-box;
  font-weight: 500;
  font-size: 0.75rem;
  min-width: 20px;
  line-height: 1;
  padding: 0 6px;
  height: 20px;
  border-radius: var(--radius-circle);
  z-index: 1;
  -webkit-transition: -webkit-transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  transition: transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  background-color: var(--background-negative);
}	

.user-menu ul li {border:0;border-bottom:1px solid var(--border-borderbase);display:block;height:auto;}
.user-menu ul li:last-child{border:0}
/* .roles {padding: 10px 0 0 10px;
} */
.roles span {background: #ddd;border-radius: var(--radius-l);display: inline-block;padding: 5px 15px;margin: 0 10px 10px 0;}
.roles span.selected {background: var(--primary);color: #fff;}
#topNav > ul > li > a:hover{background-color: var(--dropdown-hover);
}
/*Header End*/
.navbar-brand {border: 0;border-right-width: 1px;border-style: solid;}
.navbar-nav .nav-item .nav-link,.dropdown-item {-webkit-transition: background-color .3s;transition: background-color .3s;}
.theme-button,.language-button,.scale-button,.user-pic, .cart-menu,.notification-button, .help-button {display: -webkit-inline-box; -webkit-align-items: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;padding:0.55rem 0.55rem;font-family: var(--family-inter);line-height: 1;cursor: pointer;border: 0;-webkit-transition: all 0.15s ease-out;transition: all 0.15s ease-out;white-space: nowrap;-webkit-text-decoration: none;text-decoration: none;
  color:var(--content-contentsecondary);
  background: transparent;border-radius:var(--radius-circle);width: 32px;height:32px;
}
.theme-button,.language-button,.scale-button, .cart-menu,.notification-button, .help-button {display: -webkit-inline-box;display: inline-flex}
.theme-button,.cart-menu{padding:0.55rem!important}
.small_scale .theme-button,.small_scale .cart-menu{padding:0.8rem!important}
.middle_scale .theme-button,.middle_scale .cart-menu{padding:0.6rem!important}
.large_scale .theme-button,.large_scale .cart-menu{padding:0.55rem!important}
.theme-button-icon {stroke: currentColor;cursor: pointer;-webkit-transition: opacity 250ms;transition: opacity 250ms;transition-timing-function: ease-out;font-size: var(--body-2);width: 24px!important;
  height: 24px!important;
  margin-bottom: -3px;}
.theme-button-icon svg{width:32px; height:32px}
.theme-button-icon line,.theme-button-icon circle {stroke: currentColor;}
.theme-button-icon path {fill: currentColor; -webkit-transition: -webkit-transform 250ms;transition: transform 250ms;transform-origin: center;transition-timing-function: ease-out;}
.dark-mode .theme-button-icon {opacity: 0.8;-webkit-transition: opacity 250ms;transition: opacity 250ms;transition-timing-function: ease-out;}
.dark-mode .theme-button-icon path {-webkit-transform: rotate(0.5turn) translate(3%, 3%);-moz-transform: rotate(0.5turn) translate(3%, 3%);-ms-transform: rotate(0.5turn) translate(3%, 3%);transform: rotate(0.5turn) translate(3%, 3%);transform-origin: center;-webkit-transition: -webkit-transform 250ms;transition: transform 250ms;transition-timing-function: ease-out;}
.dark-mode .theme-button-icon line {stroke-linecap: butt;}
.language-button svg {width:22px; height:22px;stroke: currentColor;}

.dropdown-toggle.show::after {vertical-align: 0;transform: rotate(180deg);}
.dropdown-menu, #wrapper.toggled #sidenav .collapse {
      border-radius: var(--radius-m);
    position: absolute;
    top: 100%;
    right: 24px;
    overflow: hidden auto;
    min-width: 180px;
    min-height: 16px;
    outline: 0px;
    border: 1px solid var(--border-bordercustom);
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08);
    padding: 16px;
    background: var(--background-base);
    transition: all 0.4s ease-in-out;  
  }
  .dropdown-divider{border-top-color: var(--border-bordercustom);}
.dropdown-item, #wrapper.toggled #sidenav .collapse li{-webkit-tap-highlight-color: transparent;
  background-color: transparent;
  outline: 0px;
  border: 0px;
  margin: 0px;
  border-radius: var(--radius-none);
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  color: var(--content-contentsecondary);
  position: relative;
  text-decoration: none;
  box-sizing: border-box;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding: var(--space-m) var(--space-l);
  font-size:var(--text-l-normal-size);
  font-weight:var(--text-l-normal-weight);
  line-height:var(--text-l-normal-lineheight); 
  letter-spacing:var(--text-l-normal-letterspacing);
  
}
  .dropdown-item:focus,
.dropdown-item:hover, #wrapper.toggled #sidenav .collapse li:hover, #wrapper.toggled #sidenav .collapse li:focus {
    color: var(--content-contentsecondary) !important;
    background-color: var(--dropdown-hover) !important;
}

#repositoryDropdown{margin:0px 0 0 var(--space-l)!important}
#topNav li{margin-right:1px; align-items: center; width: 100%; box-sizing: border-box}
@media (min-width: 992px) {
  .navbar-expand-lg .navbar-nav .nav-link {padding-right: 1rem;padding-left: 1rem;}
}
.content-area {margin: 0;padding: 24px 24px 24px;border-radius: var(--radius-none);position: relative;}
.page-title {margin: 0 -1rem;padding: 0.5rem 1rem;border-radius: var(--radius-none);position: relative;border-bottom-width: 1px;border-bottom-style: solid}
.breadcrumb-item+.breadcrumb-item::before{color:var(--breadcrumb-color)}
.dropdown-toggle::after{display: none;}
.breadcrumb {margin: 0;}
.breadcrumb-item {position: relative;color:var(--breadcrumb-color);letter-spacing: 0.00938em;}
.page-title h1,
.breadcrumb-item a {font-size: 1em; line-height: 1.5;margin: 0;color:var(--breadcrumb-color);font-weight: 400;}
.small_scale .page-title h1, .small_scale .breadcrumb-item a{font-size: var(--body-2);}
.breadcrumb-item a:hover{text-decoration: underline;color:var(--breadcrumb-color)!important}
.breadcrumb-item+.breadcrumb-item {padding-left: 0.5rem}
.breadcrumb-item.active {
  color: var(--breadcrumb-active-color);
}
/* -/breadcrumbs */

/*Search Bar*/
.search-section {background: var(--background-light); }
.search-section h2 {color: #fff;font-size: var(--heading-4);font-weight: 500;margin:0 0 1.5rem 0}
.search-input {background:var(--background-bgcard);border:1px solid var(--border-borderbase); border-radius:var(--radius-s);max-width:615px;margin:auto;overflow:hidden;margin-bottom:0px!important;}
.search-input input {width:100%; box-sizing:border-box;line-height: 36px;height:40px!important;height: auto;padding:0 20px!important;background:none;font-weight:300;margin:0!important;border: 0!important;}
.search-input input:focus{box-shadow: none !important;}
.search-input-v2 { max-width:615px;margin:auto;overflow:hidden;margin-bottom:0px!important;}
.search-input-v2 input {width:100%; box-sizing:border-box;line-height: 36px;height:40px!important;height: auto;padding:0 20px!important;background:none;font-weight:300;margin:0!important;border: 0!important;}
.search-input-v2 input:focus{box-shadow: none !important;}
.input-group {position: relative;width: 100%;display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-flex-direction: row;-moz-flex-direction: row;-ms-flex-direction: row;flex-direction: row;flex-wrap: nowrap;}
.input-group>.form-control {position: relative;-webkit-box-flex: 1;-moz-box-flex: 1;-ms-box-flex: 1;-ms-flex: 1 1 auto;flex: 1 1 auto;width: 1%;margin-bottom: 0}
.input-group-append {margin-left: -1px}
.search-box-btn {position: relative;font-size: 0;white-space: nowrap;background: #fff}
.search-box-btn button {width: 40px;border:0;height: 40px;color:#444; background: url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2027.43%2027.43'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill-rule:evenodd;}%3c/style%3e%3c/defs%3e%3cg%20id='Page-1'%3e%3cg%20id='icons'%3e%3cg%20id='icon_image_search_32'%3e%3cg%20id='icon-color'%3e%3cpath%20id='path-1'%20class='cls-1'%20d='M27.43,26.03l-7.5-7.6c3.67-4.57,3.19-11.2-1.1-15.2C14.52-1.08,7.54-1.08,3.23,3.23s-4.31,11.29,0,15.6c4,4.29,10.63,4.77,15.2,1.1l7.6,7.5,1.4-1.4ZM2.43,11.43C2.43,6.46,6.46,2.43,11.43,2.43s9,4.03,9,9-4.03,9-9,9S2.43,16.4,2.43,11.43Z'/%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e") no-repeat center center; background-color: #fff}
/*search Bar End*/

/* card */
.card-body{
  flex: 1 1 auto;
  padding: 16px 16px
}
.card{
  background-color: var(--background-bgcard);
  border: var(--width-xs) solid var(--border-bordercustom);
  border-radius: var(--radius-l);
  overflow: hidden;
}

.card-group{
  display: flex;
  flex-flow: row wrap;
}
.card-group>.card{
  flex: 1 0 0%;
  margin-bottom: 0;
}
.card-group>.card:not(:last-child){
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.card-group>.card:not(:first-child){
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.card-header{border-color:var(--border-bordercustom);background-color: var(--background-transparent);padding:var(--space-l);
  color: var(--content-contentbase);
  position:relative;
  font-size: var(--heading-s-semibold-size);
  font-style: normal;
  font-weight: 600;
  line-height: var(--heading-s-semibold-lineheight, 28px); /* 140% */
  letter-spacing: var(--heading-s-semibold-letterspacing, -0.5px);
}
.card.createreport .card-content{padding:var(--space-xl) var(--space-xl) var(--space-6xl)}
.createreport .card-header{text-transform: capitalize;}
  .card p{font-size:14px;color:var(--contantstapp)}
  .card h3{font-size: 1rem; font-weight: 400;color:var(--content-contentbase)}
  .card.createreport+.card-footer{background-color: var(--background-transparent);border:0;position: relative;}
.metric-card {border:0;border-radius:var(--radius-xs);}
.card-body .card-group .card {border-width: 0 1px 0 0;}
.card-body .card-group .card:last-child {border-width: 0;}
.card-title{color:var(--content-contentbase);}

.metric-card .card-header{background-color: var(--background-bgcard);font-family: var(--heading-font);color: var(--content-contentbase);letter-spacing: 0.5px;border-bottom: 1px solid var(--border-borderbase);}
.metric-card .card-header >h3{font-size: 1.5em;line-height: 40px;margin: 0;}
.metric-card .card-footer{background-color: var(--background-bgcard);padding: 1rem 1rem;border-top:1px solid var(--border-borderbase);}
.metric-card .card-body h3 {margin-bottom: 0; font-size: min(2.375em, 40px); font-weight: bold;font-family: var(--heading-font), sans-serif;}

#card-metrix-1 .card-text{font-size: var(--body-3);}
.metric-card .card-body h3 >span{font-family: var(--family-inter), sans-serif; color: var(--content-contentsecondary); font-size:1rem;}
.metrics-value > span{vertical-align:middle;padding:4px 4px 4px 20px; border-radius:4px; background:var(--chipBg); font-size: 1em; color:var(--chipColor); position: relative;font-weight:400}
.metrics-value > span:after {width: 11px;height: 11px;content: "";display: inline-block;vertical-align: middle;margin: -7px 0 0 6px;position: absolute;top: 50%;left: 0;}
@media(min-width:768px)and (max-width:1023px){
  .metric-card{min-height: 165px;}
}
@media(min-width:1024px){
  .metric-card{min-height: 190px;}
}
@media(min-width:1280px){
  .metric-card{min-height: 166px;}
  .metric-day2 {min-height: 186px;}
}
@media(min-width:1366px){
  .metric-card{min-height: 163px;}
}
@media (min-width: 1600px){
  .metric-day2 {min-height: 162px;}
}
@media (min-width: 1670px){
  .metric-card {min-height: 143px;}
  .metric-day2 {min-height: 165px;}
}
@media (min-width: 2560px){
  .metric-day2 {min-height: 143px;}
}
/* card end */
.notification-alert{font-size:1.25em;letter-spacing: -0.5px; font-weight: 400; 
border-color:transparent;border-radius: 10px;padding: 1rem; background-color: var(--stepsGetStarted); box-shadow: 0 0 0.875rem 0 rgba(33,37,41,.05)}
.notification-alert a{text-decoration: underline;color:var(--hcl-darkblue02);}
.notification-alert .btn-close,
.dark-mode .notification-alert .btn-close{ background:transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/0.75em auto no-repeat  }



/* Steps card */
.steps {
  text-align: center;
  border: 0;
  padding: 0 60px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.steps a {
  margin: 40px;
  display: block;
}
.steps a h3 {
  color: var(--content-primary);
  font-size: 20px;
  font-weight: bold;
  letter-spacing: -0.5px;
}
.steps a p {
  color: var(--content-contentsecondary)
}
.step-icon {
  display: flex;
  position: relative;
  text-align: center;
  width: 90px;
  height: 90px;
  margin: 0 auto 2rem;
  background-color: rgb(103, 101, 101);
  background-image: conic-gradient(from -40deg, rgb(103, 101, 101), rgb(96, 96, 96));
  border-radius: 14px 14px 14px 0;
  box-shadow: 0 4px 8px 0px rgb(0 0 0 / 20%);
  color: #fff;
  transition: box-shadow 0.2s ease-in;
}
.step-icon > svg {
  vertical-align: middle;
  margin: auto;
}
.steps a:hover .step-icon {
  box-shadow: 0 8px 16px 0px rgb(0 0 0 / 30%);
  background-color: var(--background-primary);
  background-image: conic-gradient(from -40deg, #0945a8, var(--primary));
}
.steps:not(:last-child) a .step-icon:after {
  content: "";
  position: absolute;
  left: 100%;
  top: 50%;
  margin-left: 30px;
  margin-top: -50px;
  width: 343px;
  height: 52px
}

.steps:nth-child(3) a .step-icon:after {
  margin-top: 30px;
}

/* quicklinks */
.quicklinks .col{position: relative;}
.quicklinks .col:nth-child(1) :after,.quicklinks .col:nth-child(2):after,.quicklinks .col:nth-child(3):after{width:90%;height:1px;content:""; position:absolute;left:10px; bottom:-10px;border-bottom:1px solid var(--border-borderbase)}
.quicklinks .col:nth-child(2),.quicklinks .col:nth-child(5){border-left:1px solid var(--border-borderbase);border-right:1px solid var(--border-borderbase);}
.quicklinks{text-align: center;}
.quicklinks a{padding:1rem 0.75rem;display: block;}
.quicklinks a>span{color:var(--content-contentsecondary)}
.quicklink-icon{margin: 0 auto 0.75rem;}
@media (max-width:768px){
.quicklinks .col:after,.quicklinks .col:nth-child(1) :after,.quicklinks .col:nth-child(2):after,.quicklinks .col:nth-child(3):after{border:0;border-bottom:1px solid var(--border-borderbase);width:100%;height:1px;content:""; position:absolute;left:0px; bottom:-10px;}
.quicklinks .col:nth-child(2),.quicklinks .col:nth-child(5){border:0}
.quicklinks .col:last-child:after{border:0}
}
/* quicklinks End*/

.progress-status-container{border-radius:4px; border:1px solid var(--border-borderbase); padding:1rem}
.progress-status-container .progress{height: 0.5rem;width:100%;}
.section-title{position: relative; margin-bottom: 1rem;font-size:1.25em; color: var(--content-contentbase);}
.section-title:after{content:"";position: absolute;left:0;bottom:-4px; height:2px; width:50px; background-color: var(--background-primary);}
.text-dark-to-white{color: var(--content-contentbase)}
.customer-logo-placehodler{padding: 1rem;border: 1px solid #ededed;margin-right:1rem;width: 140px !important;height: 80px!important;border-radius: 10px;}

/*form elements*/
.form-label{font-family: var(--family-inter);
  font-weight: var(--heading-m-semibold-weight);
  font-size: 0.9rem;
  line-height: 1.4375em;
  letter-spacing: 0.00938em;
  padding: 0;
  position: relative;
  display: block;
  transform-origin: top left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 24px);
  margin-bottom: 0;
  -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
  transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
  z-index: 1;
  pointer-events: none;}
  .form-label.active{
    -webkit-transform:translate(14px, -9px) scale(0.75);
    -moz-transform:translate(14px, -9px) scale(0.75);
    -ms-transform:translate(14px, -9px) scale(0.75);
    transform:translate(14px, -9px) scale(0.75);
    color:var(--primary);
  }
.form-label, .form-check-label{color:var(--content-contentsecondary);}
.subLabel{font-size: 0.8rem;color:var(--breadcrumb-active-color);display: block;}
.form-label span>svg,.form-check-label span>svg{margin-top:-2px}
.form-control,.form-select,.bootstrap-tagsinput,
.checkbox-outlined, .checkbox-outlined.form-switch, .checkbox-outlined>div, .k-toolbar .k-textbox {border: 1px solid;border-radius: var(--radius-s);    border-color: var(--border-borderbase);
  background-color: var(--background-formfield);
  color: var(--content-contentsecondary);
font-size: inherit;    -webkit-animation-name: mui-auto-fill-cancel;
animation-name: mui-auto-fill-cancel;
-webkit-animation-duration: 10ms;
animation-duration: 10ms;
height: 40px;
}

.form-check-input{border:2px solid var(--border-borderbase);    width: 20px;
  height: 20px;background-color:var(--background-transparent)}
  .form-check-input[type=radio] {margin-top:2px}
.form-check-input:checked[type=radio] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2.5' fill='%23EE973F'/%3e%3c/svg%3e")
}
.form-check-input:checked,.form-check-input:focus {
  background-color: var(--background-bgcard);
  border-color: var(--border-primary);
}
.form-check-input:checked[type=checkbox] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
  background-size:20px;
  border-color: var(--border-primary);
  color: #fff;
  background-color: var(--background-primary);
}
.form-control:focus,
.k-toolbar .k-textbox:focus,
.form-select:focus {
    color: var(--content-contentsecondary);
    background-color: var(--background-bgcard);
    border-color: var(--border-primary);
    outline: 1px solid var(--form-field-focus);

}

.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active{
  color: var(--white);
  background-color: var(--background-primary);
  border-color: var(--border-primary);
}
.btn.disabled, .btn:disabled, fieldset:disabled .btn {
  border: initial;
}
.small_scale .form-control, .small_scale .form-select, .small_scale .bootstrap-tagsinput,.small_scale .input-group-text{height:30px}
.small_select .form-control {font-size: var(--body-2);}
.bootstrap-tagsinput input {color:var(--content-contentsecondary)}
.with-dropdown .form-control {border-left: 1px solid;}

.input-group-text {background-color: var(--background-bgcard); border: 1px solid var(--border-borderbase);color:var(--content-contentsecondary)}
.bootstrap-tagsinput{ display: block;box-shadow: none;line-height: 1.5;padding:.375rem .75rem;}
.bootstrap-tagsinput .tag {padding: 5px 8px;border: 1px solid #bcdcf5;background: #fff;color: #3d3d3d;cursor: pointer;border-radius: 2px;margin-right: 0.5rem;display: inline-block;margin-bottom: 0.5rem;line-height: 18px;box-shadow: none;}

/*Input type file start*/
.inputfile {width: 0.1px;height: 0.1px;opacity: 0;overflow: hidden;position: absolute;z-index: -1;}
.inputfile + label {text-overflow: ellipsis;white-space: nowrap;cursor: pointer;display: inline-block;padding: 0.625rem 1.25rem;-moz-border-radius: var(--radius-none)px;-webkit-border-radius: var(--radius-none)px;-ms-border-radius: var(--radius-none)px;-o-border-radius: var(--radius-none)px;border-radius: var(--radius-none)px; text-align:left;border:0;width:100%;position: relative;margin:0}
.inputfile:focus + label, .inputfile.has-focus + label {outline: 1px dotted #000;outline: -webkit-focus-ring-color auto 5px;}
.inputfile:focus + label, .inputfile.has-focus + label, .inputfile + label:hover {border-color:var(--primary);outline:none}
.inputfile + label span {padding: 10px}
.inputfile + label>span {max-width: 100%;min-height: 2em;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;vertical-align: top;text-align: left;line-height: 20px;z-index: 1;left: 0px;padding: 10px 0.75rem;border-bottom: 1px solid var(--border-borderbase);width: calc(100% - 93px);height: 40px;display: flex;align-items: center;}
.inputfile + label>span>span:first-child {width: 178px;padding: 0;float: left;overflow: hidden;text-overflow: ellipsis;}
.inputfile + label>span>span:last-child i{text-decoration:underline;font-size: var(--body-2)}
.inputfile + label strong {height: 100%;line-height: 21px;text-align: center;float: right;}
#importBtn.btn{min-width:auto}

/*Input file End*/
/*multiple input type file*/
.file-input{width: 100%;float: left;color: rgba(0, 0, 0, 0.3);line-height: 30px;}
.btn-file, .btn-file:hover {text-overflow: ellipsis;white-space: nowrap;cursor: pointer;display: inline-block;padding: 0.75rem 0.75rem;-moz-border-radius: var(--radius-none)px;-webkit-border-radius: var(--radius-none)px;-ms-border-radius: var(--radius-none)px;-o-border-radius: var(--radius-none)px;border-radius: var(--radius-none)px; text-align:left;border:0;border-bottom: 1px solid  var(--border-borderbase);width:calc(100% - 93px);position: relative;margin:0;color:#808080}
.btn-file input[type=file] {position: absolute;top: 0;left: 0;filter: alpha(opacity=0);opacity: 0;outline: none;cursor: inherit;display: block;}
.fileList{margin:0;padding: 0}
.fileList li{line-height: 16px;list-style-type: none}
.fileList li > span{text-overflow: ellipsis;width: calc(100% - 50px);overflow: hidden;display: inline-block;}
.removeFile{text-decoration: underline; font-size: var(--body-3);line-height: 20px;vertical-align: bottom;}
/*multiple input type file End*/
#customerLogoImg img{width:100%; height:100%}
#customerLogo+label{width:auto;}
#customerLogo+label >span{border:0}
.checkbox label{line-height: 30px;}
/* Outlined checkbox */
.checkbox-outlined,.checkbox-outlined.form-switch{ padding: 0;display: flex;border-radius: 4px;border: 1px solid var(--border-borderbase) ;max-width: max-content;overflow: hidden;margin-right:1rem;    margin-top: 20px;}
.checkbox-outlined>div{padding: 6px 10px;border: 0;align-items: center;display: flex;border-right: 1px solid var(--border-borderbase); border-radius: var(--radius-none);}
.checkbox-outlined .form-check-label{padding:10px 10px;display: flex;align-items: center;}
.checkbox-outlined .form-check-label span{margin-left:6px}
.checkbox-outlined .form-check-input{margin: 0;}
/* Outlined checkbox End*/
/*form elements end*/
#customerLogoImg img.default{filter: grayscale(1)}
.button-section{border-top:1px solid var(--border-borderbase); padding:1.5rem 0; text-align: center; background: var(--background-light);}
.help-text{font-size: var(--body-3)}
.accordion-header{width:100%;}
.accordion-item{background-color: var(--background-bgcard);
  min-height: 48px;
  padding: 0px;
  transition: min-height 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;    color: rgba(0, 0, 0, 0.87);
  box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 1px -1px, rgba(0, 0, 0, 0.14) 0px 1px 1px 0px, rgba(0, 0, 0, 0.12) 0px 1px 3px 0px;
  position: relative;
  overflow-anchor: none;
  border-radius: var(--radius-none)px;
}
#addEditAccordion .accordion-item, .addEditAccordion .accordion-item{border:0;
  border-radius: var(--radius-none);
}

#addEditAccordion h2, .addEditAccordion h2{font-size: var(--heading-6);line-height: 48px;margin: 0;}
#addEditAccordion .accordion-button, .addEditAccordion .accordion-button{width:auto;border-radius: var(--radius-none); padding: 0px 16px;    background: var(--background-bgcard);color: var(--content-contentsecondary);}
#addEditAccordion .accordion-button:not(.collapsed), .addEditAccordion .accordion-button:not(.collapsed){box-shadow: none;color:var(--primary);}
#addEditAccordion .accordion-button::after, .addEditAccordion .accordion-button::after{background-image: url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill:%23fff;}.cls-2{fill:%232874f0;}%3c/style%3e%3c/defs%3e%3crect%20id='Rectangle'%20class='cls-2'%20width='24'%20height='24'/%3e%3cg%20id='icon_navigation_subtract_24'%3e%3cg%20id='icon-color'%3e%3crect%20id='path-1'%20class='cls-1'%20x='5.3'%20y='10.2'%20width='13.5'%20height='3.1'/%3e%3c/g%3e%3c/g%3e%3cg%20id='icon_navigation_subtract_24-2'%3e%3cg%20id='icon-color-2'%3e%3crect%20id='path-1-2'%20class='cls-1'%20x='10.5'%20y='5.2'%20width='3.1'%20height='13.5'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e");width:24px; height: 24px;}
.addEditAccordion.withDropdownIcon .accordion-button{padding: 0 16px !important;}
.addEditAccordion.withDropdownIcon .accordion-button::after{background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");width: 14px;height: 14px;background-size: auto;}
.addEditAccordion.withDropdownIcon .accordion-button:not(.collapsed)::after{background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");}
.addEditAccordion.withDropdownIcon .accordion-item{border-bottom:1px solid var(--border-borderbase); min-height: initial;margin-bottom: 16px}
.addEditAccordion.withDropdownIcon h2{line-height: 38px;}
#addEditAccordion .accordion-button:not(.collapsed)::after, .addEditAccordion .accordion-button:not(.collapsed)::after{background-image: url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill:%23fff;}.cls-2{fill:%232874f0;}%3c/style%3e%3c/defs%3e%3crect%20id='Rectangle'%20class='cls-2'%20width='24'%20height='24'/%3e%3cg%20id='icon_navigation_subtract_24'%3e%3cg%20id='icon-color'%3e%3crect%20id='path-1'%20class='cls-1'%20x='5.3'%20y='10.5'%20width='13.5'%20height='3.1'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e")}
.card-actions li{margin-bottom:6px;width:100%}
.card-actions li a{display: block;}

.btn-close{ background:transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/0.75em auto no-repeat ;}
.dark-mode .btn-close{ background:transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/0.75em auto no-repeat ;}
.details-list .accordion-button.complete{border-left:4px solid var(--background-positive)}
.details-list .accordion-button.error{border-left:4px solid var(--critical)}
.accordion-body {
  padding: 8px 16px 16px;
}
/* Modal Slideout*/
/* @media (max-width: 576px) {
  .modal-dialog.modal-dialog-slideout {width: 80%}
} */
.modal-dialog .modal-content{
  border-radius: var(--radius-l)!important;
  background-color: var(--background-base);
  border: none!important;
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  box-shadow:  -3px 0px 16.5px 2px rgba(0, 0, 0, 0.07);}
  .modal-body{padding: var(--space-l) var(--space-xl)}
  .modal-header{
    border-bottom:var(--width-xs) solid var(--border-borderbase);
    margin: 0px;
      color:var(--content-contentbase);    
      font-size: var(--text-xl-semibold-size);
      font-style: normal;
      font-weight: var(--text-xl-semibold-weight);
      line-height: var(--text-xl-semibold-lineheight);
      letter-spacing: var(--text-xl-semibold-letterspacing);
      padding: var(--space-l);
      flex: 0 0 auto;
  
  }
.modal-dialog .modal-body{
  padding: var(--space-l) var(--space-xl);
  overflow: auto;
  }
.modal-footer {
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  padding: var(--space-l);
  -webkit-box-pack: end;
  justify-content: flex-end;
  flex: 0 0 auto;
  gap:var(--space-s);
  border-top:var(--width-xs) solid var(--border-borderbase);
}
.k-window.k-dialog.slideout,
.modal-dialog-slideout {min-height: 100%;margin: 0 0 0 auto;background: var(--background-transparent);height: 100%;max-width: 100%;box-shadow: rgba(0, 0, 0, 0.2) 0px 11px 15px -7px, rgba(0, 0, 0, 0.14) 0px 24px 38px 3px, rgba(0, 0, 0, 0.12) 0px 9px 46px 8px;}

.k-window.k-dialog.modal-dialog-slideout,
.modal.fade .modal-dialog.modal-dialog-slideout {-webkit-transform: translate(100%, 0);transform: translate(100%, 0);right:0!important;}

.k-window.k-dialog.modal-dialog-slideout.show,
.modal.fade.show .modal-dialog.modal-dialog-slideout {-webkit-transform: translate(0, 0);transform: translate(0, 0);flex-flow: column;transition: all 0.2s; left: auto!important;}
.modal-dialog-slideout .modal-content {
  height: 100%;
  min-height: 100%;
  border: 0;
  background: var(--background-base);
  border-radius:var(--radius-l)!important;
  border-top-right-radius: var(--radius-none)!important;
  border-bottom-right-radius: var(--radius-none)!important;
  
}
.k-window.k-dialog.modal-dialog-slideout.leftSlide,
.modal.fade .modal-dialog.modal-dialog-slideout.leftSlide {right:auto!important;left: 0 !important;}
.k-window.k-dialog.modal-dialog-slideout.modal-lg.show{width:70%}
.modal-dialog-slideout .k-dialog-content{padding:0}
.k-window-content.k-dialog-content{overflow-y: auto;max-height:600px}
.modal-dialog-slideout .k-window-content.k-dialog-content{overflow-y: auto;max-height: 100%;}
.modal-dialog-slideout .modal-footer .btn:not(:first-child){margin-left: 0.5rem;}
.modal.fade[data-bs-backdrop="false"] .modal-dialog{box-shadow: -5px 0px 7px #00000020;}

.k-widget.k-grid{border:0;border-radius: var(--radius-none);box-shadow: none; padding-top:1rem}
.k-grid-header:first-child, .k-grid>.k-grouping-header{border-radius: var(--radius-none);}
.k-grid-toolbar{width:100%; color:var(--content-contentbase);background-color: var(--background-bgcard);}
.k-grid-toolbar.k-toolbar h5{margin: var(--space-none); font-size: var(--text-l-regular-size)}
.k-grid-header-wrap{border-top-width:1px}
.k-alt.k-master-row{background-color:var(--border-bgcard);}
.k-widget.k-grid .k-pager-wrap{box-shadow: none;border:0;padding: 10px;border-bottom:1px solid}
.k-grid .k-grid-pager{border-radius: var(--radius-none);flex-direction: row;gap:30px;justify-content: space-between;}
.k-grid-toolbar .k-button{padding:0.65rem .5rem; background-color: var(--background-bgcard); border-color:var(--border-borderbase); color:var(--content-contentsecondary);}
.k-grid-toolbar .k-button.btn-sm{padding:0.25rem .5rem;}
.k-grid tr td {border-width: 0 0 1px 0;border-color:var(--border-borderbase2)}
.k-toolbar .k-textbox {border-radius: var(--radius-none).25rem;}
.k-autocomplete,.k-draghandle,.k-dropdown-wrap,.k-grid-header,.k-grouping-header,.k-header,.k-numeric-wrap,.k-panelbar .k-tabstrip-items .k-item,.k-picker-wrap,.k-progressbar,.k-state-highlight,.k-tabstrip-items .k-item,.k-toolbar,.k-pager-wrap {background-image: none}

.k-grid td{vertical-align: top;}
.k-pager-wrap .k-pager-numbers .k-link {color: var(--content-primary)}
.k-pager-wrap .k-pager-numbers .k-link:hover {border-color: #ccc}
.k-pager-wrap .k-link.k-pager-nav {color: var(--content-primary)}
.k-pager-wrap .k-link{     border-color: var(--border-borderbase);background: var(--background-bgcard);}
.k-pager-wrap .k-link:hover{background: var(--background-bgcard); border-color: var(--border-borderbase)}
.k-pager-wrap.k-grid-pager .k-link.k-pager-nav.k-state-disabled {color: #676767}
.k-pager-wrap .k-pager-numbers .k-link.k-state-selected {background-color: var(--background-primary);color: #fff;border-color: var(--border-primary);}
.k-widget.k-dropdown{background-color: var(--background-bgcard);color:var(--content-contentsecondary);border:1px solid var(--border-borderbase);border-radius:4px}
.k-dropdown .k-input,.k-dropdown-wrap.k-state-hover .k-input,.k-dropdown-wrap.k-state-active .k-input,.k-dropdown-wrap.k-state-focused .k-input{color:var(--content-contentsecondary)}

.k-icon.k-i-filter,.k-icon.k-i-file-excel,.k-icon.k-refresh {width: 1.5em;height: 1.5em;}
.k-i-search:before{content:"";background: url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2027.43%2027.43'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill-rule:evenodd;}%3c/style%3e%3c/defs%3e%3cg%20id='Page-1'%3e%3cg%20id='icons'%3e%3cg%20id='icon_image_search_32'%3e%3cg%20id='icon-color'%3e%3cpath%20id='path-1'%20class='cls-1'%20d='M27.43,26.03l-7.5-7.6c3.67-4.57,3.19-11.2-1.1-15.2C14.52-1.08,7.54-1.08,3.23,3.23s-4.31,11.29,0,15.6c4,4.29,10.63,4.77,15.2,1.1l7.6,7.5,1.4-1.4ZM2.43,11.43C2.43,6.46,6.46,2.43,11.43,2.43s9,4.03,9,9-4.03,9-9,9S2.43,16.4,2.43,11.43Z'/%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e") center; width: 16px; height: 16px;}
.k-grid-header th.k-state-focused,.k-list>.k-state-focused.k-state-selected, .k-listview>.k-state-focused.k-state-selected, .k-state-focused.k-state-selected, td.k-state-focused.k-state-selected{box-shadow: none;}
.k-header>.k-grid-filter,
.k-header>.k-header-column-menu {margin: -.5em -.3em -.4em 0;padding: 0}
.k-grid-filter.k-state-active { box-shadow: none;background-color: transparent}
.k-filter-menu .k-action-buttons .k-button.btn.border {background: var(--hcl-blue10);background-image: none}
.k-filter-menu .k-action-buttons .k-button.btn-gradient-primary {border: 1px solid #dee2e6}
.k-popup.k-filter-menu {box-shadow: 0 5px 10px rgb(0 0 0 / 20%);border: 0}
.k-filter-help-text {    font-weight: 400;
  color: var(--content-contentbase);}
.k-dropzone-hovered,.k-footer-template td,.k-grid-footer,.k-group,.k-group-footer td,.k-grouping-header,.k-popup,.k-widget .k-status {background-color: #fff}
.k-autocomplete,.k-dropdown-wrap.k-state-default,.k-numeric-wrap.k-state-default,.k-picker-wrap.k-state-default {background-image: none;background-position: 50% 50%;color: #808080;border: 0;background-color: transparent;}
.k-dropdown-wrap.k-state-active.k-state-border-down,.k-numeric-wrap .k-link.k-state-selected,.k-picker-wrap.k-state-active.k-state-border-down {box-shadow: none;}
.k-dropdown-wrap.k-state-focused,.k-numeric-wrap.k-state-focused,.k-picker-wrap.k-state-focused {box-shadow: none}
form.k-filter-menu .k-textbox {color:var(--content-contentsecondary);border:1px solid var(--border-borderbase);background-color: var(--background-bgcard);}
form.k-filter-menu .k-dropdown {margin-top: 20px;}
.k-filter-menu .k-action-buttons {margin: 14px 0 0 0;}
.k-autocomplete.k-state-border-down,.k-autocomplete.k-state-border-up,.k-datepicker-calendar,.k-dropdown-wrap.k-state-active,.k-filebrowser .k-image,.k-grid .k-filter-options,.k-menu .k-menu-group,.k-multiselect.k-state-focused,.k-picker-wrap.k-state-active,.k-popup,.k-time-popup {box-shadow: none}
.k-dropdown-wrap.k-state-disabled {border: 0;border-bottom: 1px solid #E2E2EA;background-color: #ececec}
.k-grid-header .k-i-sort-asc-sm, .k-grid-header .k-i-sort-desc-sm, .k-grid-header .k-sort-order {color: var(--content-primary);}
.k-grid-header .k-link .k-icon.k-i-sort-asc-sm, .k-grid-header .k-link .k-icon.k-i-sort-desc-sm{margin-top:5px}
.k-grid-header th.k-header .k-checkbox{vertical-align: middle;}
.k-checkbox:checked{    border-color: var(--border-primary);color: #fff;background-color: var(--background-primary);}
.k-checkbox:checked:focus{border-color: var(--border-primary);}
.table-striped tbody tr.k-state-selected:nth-of-type(odd), .k-draghandle.k-state-selected:hover, .k-ghost-splitbar-horizontal, .k-ghost-splitbar-vertical, .k-list>.k-state-highlight, .k-list>.k-state-selected, .k-marquee-color, .k-panel>.k-state-selected, .k-scheduler .k-today.k-state-selected, .k-state-selected, .k-state-selected:link, .k-state-selected:visited, .k-tool.k-state-selected {color: #212529;background-color: #ddd;border-color: #ddd;}
.k-grid tr.k-state-selected:hover td {background-color: var(--background-light);color:#212529}
.k-grid-header th.k-header>.k-link{line-height: normal;padding:0; min-height: auto;font-weight: normal;color:var(--content-contentbase)!important; letter-spacing: 0.5;}
.k-popup{background-color: var(--background-base);}
.k-list-container{border-color:var(--border-borderbase2);color:var(--content-contentsecondary)}
.k-list>.k-state-hover,.k-list>.k-state-selected{background-color: var(--background-light);color:var(--content-contentsecondary)}
.k-block, .k-content, .k-dropdown .k-input, .k-popup, .k-widget{color:var(--content-contentsecondary)}
/*Kendo End*/

.with-dropdown .input-group-text {font-size: var(--body-1);font-weight: bold;border-radius: var(--radius-none).25rem;border: 1px solid;}
.nav-tabs.horizontal-tabs {
  border-bottom-color: var(--border-borderbase);
}
.horizontal-tabs .nav-link {border: 0;border-bottom-width: 2px;border-style: solid; letter-spacing: 0.5px;border-color: transparent;
  color: var(--content-contentsecondary);padding:12px 16px;min-height:48px;    font-weight: 500;
  font-size: 0.875rem;
  line-height: 1.25;
  text-transform: uppercase;transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;}
.small_scale .horizontal-tabs .nav-link {letter-spacing:0.5px; font-weight: 600;}
.horizontal-tabs .nav-link .myicons{font-size:1.25em}
.horizontal-tabs .nav-link:hover,.horizontal-tabs .nav-link.active {
  border: 0;
  border-bottom-width: 2px;
  border-style: solid;
  color: var(--content-contentsecondary);
  border-bottom-color: var(--border-primary);
  background-color: var(--background-transparent);}
.tab-pane {padding: 1rem 0}
.horizontal-tabs + .tab-content > .tab-pane{padding:1rem}
#horizontalViewTabContent > .tab-pane {padding-top: 0;}
.nav-pills.nav-tabs{box-shadow: 0 2px 5px rgb(0 0 0 / 10%);border: 0;padding:0.5rem 0}
.nav-pills.nav-tabs li:not(first-child){margin-left: 6px;}
.nav-pills.nav-tabs .nav-link{border: 1px solid;border-style: solid;background: #fff;border-radius: 16px;line-height: 14px;}
.vertical-tabs .list-group-item.active{border:1px solid;border-right: 2px solid;}
.vertical-tabs.nav-tabs .nav-link{position: relative;display: block;text-align: center;padding: 6px 8px;color: var(--button-buttonlink);box-shadow: none;background-color: var(--background-transparent);border: var(--width-m) solid var(--border-bordertransparent);border-radius:0}
.vertical-tabs.nav-tabs .nav-link span{display:block;}
.vertical-tabs.nav-tabs .nav-link.active,.vertical-tabs .list-group-item-action.active {justify-content: center;  border-left-color: var(--border-primary);}
.vertical-tabs .list-group-item-action span{top:50%;height: 10px;border-radius: 5px;width: 10px;border: 1px solid #fff;float:right}
.nav-pills.nav-tabs .nav-link.active {border: 1px solid;border-style: solid;}
.vertical-tabs.list-group{border-radius:6px}
.vertical-tabs .list-group-item{padding: 1rem; }

/*Chosen Dropdown*/
.chosen-container,.custom-select {font-size: var(--body-2)}
.custom-box-select {padding: 0;position: relative;}
.chosen-container.chosen-container-multi {padding: 0 0.25rem}
.custom-box-select:after {content: "";clear: both;display: block;overflow: hidden;border-top: 1px solid var(--nav-link-color);border-left: 1px solid var(--nav-link-color);border-bottom: 1px solid transparent;border-right: 1px solid transparent;transform: rotate(225deg);width: 0.5rem;height: 0.5rem;transition: all 0.2s;position: absolute;right: 10px;top: 50%;margin-top: -0.5rem;}
.custom-box-select select::placeholder {color: #ff0000 !important;}
.custom-box-select.active label {top: -30px;font-size: var(--body-3);left: 0;}
.custom-box-select input {margin-top: 0px !important;}
.chosen-container-single .chosen-single span {font-size: var(--body-1);}
.small_scale .chosen-container-single .chosen-single span{font-size: var(--body-2);}
.chosen-container-multi .chosen-choices li.search-field input[type="text"] {height: 34px;color: #212529;font-size: var(--body-1);}
.custom-box-select i {width: 30px;height: 30px;position: absolute;top: 6px;right: 0;z-index: 10;}
.custom-box-select .chosen-container-multi .chosen-choices {border: 0;background: none; background-image: none !important;padding: 0;}
.custom-box-select .chosen-container {width: 100% !important;}
.custom-box-select .chosen-container-active .chosen-choices {border: 0;box-shadow: none;width: 100% !important;}
.custom-box-select .chosen-container .chosen-drop {border: 1px solid var(--border-borderbase) !important;background:var(--background-bgcard);}
.custom-box-select .chosen-container-multi .chosen-choices li.search-choice,
.form-control .badge {box-shadow: none;border-radius: 2px;cursor: pointer;display: inline-block; border: 1px solid #a9ceed; background: #f5fbff;color: #3d3d3d;line-height: 18px;}
.chosen-container-multi .chosen-choices li.search-choice {padding: 5px 20px 5px 8px;}
.custom-box-select .chosen-container-multi .chosen-choices li.search-choice span {margin-right: 10px;}
.custom-box-select .chosen-container .chosen-results li {padding: 8px 15px;border: none;margin: 0}
.custom-box-select .chosen-container .chosen-results {max-height: 130px}
.custom-box-select .chosen-container-single .chosen-single {position: relative;display: block;overflow: hidden;padding: 0 0 0 8px;height: 37px;border: 0; border-radius: var(--radius-none); background: var(--input-background); -webkit-box-shadow: none;box-shadow: none;color: var(--content-contentsecondary);text-decoration: none;white-space: nowrap;line-height: 37px;}
.custom-box-select .chosen-container-active.chosen-with-drop .chosen-single {border: 0;border-bottom: 1px solid var(--border-borderbase);border-radius: var(--radius-none);background-color: var(--background-bgcard);-webkit-box-shadow: none;box-shadow: none;color: var(--content-contentsecondary);}
.custom-box-select .chosen-container-single .chosen-search input[type="text"] {border: 0;border-bottom: 1px solid var(--border-borderbase);padding: 4px 20px 4px 16px;height: 37px;color:var(--content-contentsecondary);}
.chosen-container .chosen-results{color:var(--content-contentsecondary)}
.custom-box-select .chosen-container .chosen-results li.highlighted {background-color: var(--background-base);background-image: none;color: var(--content-contentsecondary)}
.chosen-container-multi .chosen-drop .result-selected {background: var(--background-base);}
.custom-box-select .chosen-container > a{color:var(--content-contentsecondary)!important}

/*Chosen Dropdown End*/
/*Bootstrap Multi select*/
.custom-select:focus {border-width:1px;border-color:transparent transparent #83a8bc transparent; color:#007bff}
.multiselect-container.dropdown-menu{max-height: 200px;overflow-y:auto;}
.multiselect-container .multiselect-option.active:not(.multiselect-active-item-fallback), .multiselect-container .multiselect-group.active:not(.multiselect-active-item-fallback), .multiselect-container .multiselect-all.active:not(.multiselect-active-item-fallback), .multiselect-container .multiselect-option:not(.multiselect-active-item-fallback):active, .multiselect-container .multiselect-group:not(.multiselect-active-item-fallback):active, .multiselect-container .multiselect-all:not(.multiselect-active-item-fallback):active,
.multiselect-option.dropdown-item:hover{background-color: #f0f8ff;color:#808080}
.multiselect-container .multiselect-option, .multiselect-container .multiselect-group, .multiselect-container .multiselect-all {padding: 1rem 0.25rem 0.5rem 0.75rem;}
.multiselect-container .multiselect-filter > .fa-search{padding: 0;}
.multiselect-container .multiselect-filter > input.multiselect-search{padding-left:1rem;margin-left:0}
.multiselect-container{-webkit-box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);border:1px solid #E2E2EA !important}
.ms-options-wrap > button:focus, .ms-options-wrap > button {border: 1px solid transparent;padding: 7px 20px 7px 5px;border-bottom: 1px solid #E2E2EA;color: #808080;}
.ms-options-wrap > .ms-options{border:1px solid #E2E2EA !important;
box-shadow: 0 4px 5px rgba(0, 0, 0, 0.15);
}
.ms-options-wrap > .ms-options > .ms-search input{border-bottom:1px solid #E2E2EA !important;}
 /*Bootstrap Multi select End*/

#accordionCustomerInprogress .accordion-item{border:0}
#customerProgress_section .card-body{height: calc(100% - 50px);overflow-x: hidden;overflow-y: auto;}
.btn-view-progress{border:0;background-color: #ddd;position: absolute;right: 0;top: 0;bottom: 0;}
.percantage-chart.customer-progress{width:60px}
.auth-type{display: none;}
.auth-type-details{padding:1rem; border:1px solid var(--border-borderbase);border-top:0}
.auth-type .details-list-section {border:1px solid var(--border-borderbase)}
 /* old */

/*Table start*/
.table>:not(:first-child){border-top: 1px solid;border-bottom: 1px solid;}
.table th{color:var(--content-contentbase); font-weight: 500;}
.table th,.table td {border-top: 1px solid;border-bottom: 1px solid ;vertical-align: middle;}
td > .btn.btn-link{padding: 0; min-width:auto}
table td .btn{color:inherit}

.hiddensearch {padding: 0;display: none;border: 1px solid #ffffff;box-shadow: 1px 3px 6px 0px rgb(41 39 39 / 39%);position: absolute;width: 400px;background: var(--background-base);top: 0;z-index: 1;right: 1px;}
.hiddensearch input {margin: 0;border: transparent 0;height: 48px;color: rgba(0, 0, 0, .84);font-size: var(--body-1);width: 100% !important;border-bottom: 1px solid #a9abac;margin-left: 0 !important;}
.hiddensearch input:focus {border: 0;border-bottom: 1px solid var(--primary);box-shadow: none}
.hiddensearch label {display: block}
.dataTables_filter {width: 100%}
#mainTable,#table_id_wrapper {height: 100%;transition: all 0.3s;}
.main-table-wrapper {height: 480px;overflow-y: auto;}
.col-md-4 .main-table-wrapper {height: 520px;}

table.dataTable tbody th,table.dataTable tbody td {padding: 6px 10px;}
table.dataTable,table.dataTable th,table.dataTable td {box-sizing: border-box;border-collapse: collapse;}
table {margin: 0 auto;clear: both;width: 100%;background-color: var(--border-bgcard);color:var(--content-contentsecondary)}
table,.table-striped>tbody>tr:nth-of-type(odd)>*{ color:var(--content-contentsecondary)!important;}
.table.fixed-layout{table-layout: fixed;}
td [type="checkbox"]+span:not(.lever) {margin-top: 10px}
table.dataTable thead th,table.dataTable thead td,table.dataTable tbody th,table.dataTable tbody td {padding-left: 10px;padding-right: 10px;white-space: nowrap;text-overflow: ellipsis;vertical-align: middle;}
table.dataTable.no-footer,table.dataTable thead th {border-bottom: 1px solid var(--border-borderbase);border-top: 1px solid var(--border-borderbase);}
table.dataTable thead .sorting,table.dataTable thead .sorting_asc,table.dataTable thead .sorting_desc {background: none;}
th.sorting_disabled span {background: none;}
table.dataTable thead th span {margin-left: 5px;display: inline-block;width: 16px;height: 16px;vertical-align: middle;background-position: center center;background-size: contain;}
.table-heading {font-size: var(--body-1);font-weight: bold;line-height: 36px;}
.table-action .dataTables_filter {height: 39px;width: auto}
.table-action .dataTables_filter input,.dataTables_filter input {border-radius: var(--radius-none);height: 37px;background-color: inherit;margin-left: 0;}
.table-action .dataTables_filter label {margin-bottom: 0;width: 100%;}
.table-action .dataTables_filter.search-box {border-radius: 30px;border: 1px solid #F5F5F5;}
.table-action .dataTables_filter.search-box input[type=search]:not(.browser-default):focus:not([readonly]) {border: 0}
.table-action .dataTables_filter.search-box input,.table-action .dataTables_filter.search-box .input-group-text,.table-action .dataTables_filter.search-box input[type=search]:not(.browser-default):focus:not([readonly]) {border: 1px solid #000;}
table.dataTable tbody td.select-checkbox{position: relative;}table.dataTable thead th.select-checkbox button:after {position: absolute;display: block;}
table.dataTable tbody td.select-checkbox:before,table.dataTable tbody th.select-checkbox:before{content:"";width: 18px;height: 18px;top: 50%;border: 1px solid #c3c3c3;background: var(--background-base);margin-top: -9px;margin-left: -9px;left: 25px;position:absolute;border-radius: 3px;}
table.dataTable tr.selected td.select-checkbox:after,table.dataTable tr.selected th.select-checkbox:after {content: '';transform: rotate(45deg);position: absolute;left: 25px;top: 50%;width: 6px;height: 13px;border-width: 2px;border-style: solid;border-top: 0;border-left: 0;border-color: var(--border-primary);z-index: 997;margin-top: -8px;margin-left: -3px;background: transparent;}
table.dataTable thead th.select-checkbox {position: relative;}
table.dataTable thead th.select-checkbox button {position: absolute;width: 18px;height: 18px;top: 50%;border: 1px solid #c3c3c3;background: var(--background-base);margin-top: -9px;margin-left: -9px;left: 25px;border-radius: 3px;}
table.dataTable thead th button.selected:after {transform: rotate(45deg);position: absolute;left: 8px;top: 50%;width: 6px;height: 13px;border-width: 2px;border-style: solid;border-top: 0;border-left: 0;border-color: var(--border-primary);content: '';z-index: 997;margin-top: -8px;margin-left: -3px;background: transparent;}
.table-footer {display: flex;justify-content: center;flex-direction: row;padding-top: 8px}
.dataTables_length .form-control {width: auto;display: inline-block;}
table.dataTable.hover tbody>tr.selected:hover,table.dataTable.hover tbody>tr>.selected:hover,table.dataTable.display tbody>tr.selected:hover,table.dataTable.display tbody>tr>.selected:hover,table.dataTable tbody>tr.selected,table.dataTable tbody>tr>.selected {background-color: #d1e6f9;}
table.dataTable.display tbody>tr.selected:hover>.sorting_1,table.dataTable.order-column.hover tbody>tr.selected:hover>.sorting_1 {background-color: transparent !important;}
table.dataTable tbody>tr.is-disabled,table.dataTable tbody>tr>.is-disabled {background-color: #f7f7f7;opacity: 0.6}
#table_id tbody tr td:nth-of-type(1),#table_id tbody tr td:nth-of-type(2) ,#table_id tbody tr td:nth-of-type(3) {cursor: pointer;}
#table_id tbody tr td:nth-of-type(1),
#table_id_wrapper .dataTables_scrollHeadInner thead tr th:nth-of-type(1),
#table_id tbody tr td:nth-of-type(2),
#table_id_wrapper .dataTables_scrollHeadInner thead tr th:nth-of-type(2) {background-color: var(--background-base);border-right: 1px solid var(--border-borderbase)}
#table_id tbody tr td:nth-of-type(3),#table_id_wrapper .dataTables_scrollHeadInner thead tr th:nth-of-type(3) {background-color: var(--background-base);border-right: 2px solid var(--border-borderbase);box-shadow: 12px 2px 1rem rgb(0 0 0 / 12%);}
th,td {white-space: nowrap;}
div.dataTables_wrapper {width: 100%;margin: 0 auto;}
.dataTables_scrollBody #table_id>thead>tr>th>span {display: none;}
.table>:not(caption)>*>* {box-shadow: none;}
/* Table End */

/*global Chips*/
.gbl-chips {padding: 5px 8px;border: 1px solid #bcdcf5;background: var(--background-base);color: #056aa5;cursor: pointer;border-radius: 2px;margin-right: 10px;display: inline-block;margin-bottom: 10px;line-height: 18px;}
.gbl-chips:hover,.gbl-chips.selected {border: 1px solid #a9ceed;background: #f5fbff;color: #3d3d3d;}
.gbl-selected {padding: 10px 5px 0 5px;background: var(--background-base);}
.accordion.more-filters .card,.accordion .card {border-radius: 4px;border: 1px solid #e2e2ea;overflow: inherit;}
.accordion.more-filters .card-header,.accordion .card-header {padding: 0.25rem 1rem}
.accordion.more-filters .card-header .gbl-chips {padding: 6px 8px;border: 1px solid #bcdcf5;background: var(--background-base);color: #056aa5;cursor: pointer;border-radius: 2px;margin-right: 10px;display: inline-block;margin-bottom: 0;}
.accordion.more-filters .card-header .gbl-chips:hover,.gbl-chips.selected {border: 1px solid #a9ceed;background: #f5fbff;color: #3d3d3d;}
.accordion.more-filters .card-header .gbl-selected {padding: 10px 5px 0 5px;background: var(--background-base);}
/*global Chips End*/

/*Pills*/
/*Pills End*/
.legends{display: flex;
    flex-direction: row;
    flex-wrap: wrap;width:fit-content;
  }
.legends li{display: inline-block;font-size: 0.75rem;}
.legends li:not(:last-child){margin-right:16px}
#actionableTab.nav-tabs .nav-link span,.service-list .nav-link span, .legends span, span.legends {width: 10px;height: 10px;display: inline-block;border-radius: 50%;margin-right: 10px;}
.service-list li {border-bottom: 1px solid;list-style-type: none;display: flex;justify-content: space-between;}
.service-toggle {position: absolute; top: 4px;width: 30px;height: 30px; z-index: 2;background: var(--background-base);color: #000;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
.service-toggle>span {content: "";position: absolute;border-top: 2px solid;border-left: 2px solid;border-bottom: 2px solid transparent;border-right: 2px solid transparent;transform: rotate(-45deg);width: 10px;height: 10px;transition: all 0.2s;top: 10px;left: 11px}
#serviceList {position: static;left: 0;top: 0px;margin-left: -270px;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;z-index: 1;width: 270px;height: auto;overflow: hidden;overflow-y: auto;padding: 0 1rem}
#serviceList ul {height: 100%;width: 100%;flex-wrap: nowrap;}
#serviceList>ul>li {bottom: 0;top: 43px;position: absolute;overflow-x: hidden;overflow-y: auto;left: 0;right: 0;}
#serviceList ul ul {padding: 0;}
#tableWrap {position: relative;}
#mainTable {width: 100%; right: 0;top: 0px;transition: all 0.3s ease-out;max-height: 410px;overflow-y: auto;}
#tableWrap.toggled #mainTable {width: calc(100% - 270px);}
#tableWrap.toggled #serviceList {margin-left: 0}
#tableWrap.toggled #serviceToggle,#serviceToggle {left: -20px;}
#tableWrap.toggled #serviceToggle>span {transform: rotate(135deg);left: 8px}
@media (min-width: 768px) {
  #serviceToggle {left: 224px;}
  #serviceList {margin-left: 0;padding: 0}
  #mainTable {min-width: 0;width: calc(100% - 270px);}
  #tableWrap.toggled #mainTable {width: 100%;}
  #tableWrap.toggled #serviceList {margin-left: -270px;opacity: 0;}
}
.navbar-collapse.action-section {padding: 0rem;position: absolute;top: 0;right: -75%;height: 100%;min-height: 100%;z-index: 99;background-color: var(--background-base);box-shadow: -10px 0 12px -4px rgba(0, 0, 0, 0.23);-webkit-transition: right .3s ease-out;-moz-transition: right .3s ease-out;-o-transition: right .3s ease-out;transition: right .3s ease-out;overflow-x: hidden;overflow-y: auto;}
.navbar-collapse.action-section.show {left: 0;right: 0}
.navbar-collapse.action-section>.row {height: auto}
.action-section>div.section1,.action-section>div>div,.action-section .card {height: 100%}
.action-name {font-size: var(--body-1);line-height: 48px;font-weight: bold;}
.related-name,.service-name {font-weight: bold;}

#actionActivitiesTabContent {padding-top: 8px;}
#actionPanel .section1 .card-body,#actionPanel .section2 .card-body,#logs_section .section2 .card-body {height: calc(100% - 50px);overflow-x: hidden;overflow-y: auto;}
.jobdescription-detail, .ticketdescription-detail{list-style-type: none;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-ms-flex-direction: row;flex-direction: row;-ms-flex-wrap: wrap;flex-wrap: wrap;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;padding: 0;margin: 00;}
.jobdescription-detail .jobdescription-detail-value, .ticketdescription-detail .ticketdescription-detail-value{position: relative;padding: 0.25rem;margin-bottom: 0.25rem;-webkit-box-flex: 1;-ms-flex: 1;flex: 1;min-width: 25%;background: #fbfbfb;border: 1px solid #f9f8f8;min-height: 64px; margin-right:0.25rem;}
.ticketdescription-detail .ticketdescription-detail-value{ min-width: 33%;}
.jobdescription-detail .jobdescription-detail-value>span,.ticketdescription-detail .ticketdescription-detail-value>span{display: block; margin-bottom: 0px;text-transform: none;color: #6c757d}
.jobdescription-detail .jobdescription-detail-value .dynamic-value,.ticketdescription-detail .ticketdescription-detail-value .dynamic-value{color: #000;}
.metricdetails-data {padding: 0}
.metricdetails-data li {border: 0;padding: 8px 15px;list-style-type: none;color: #444}
.metricdetails-data li:first-child {border-left: 0;}
.metricdetails-data li>span {display: block;color: #787e85;font-size: 1.1rem !important;}
.metricdetails-data .badge {font-size: var(--body-1);margin-bottom: 6px;font-weight: 400;}
.metricdetails-data li:last-child {width: 100%;display: block;}
@media (min-width:992px) {
  .navbar-collapse.action-section {overflow: hidden;}
  .navbar-collapse.action-section>.row {height: calc(100% - 67px)}
  .metricdetails-data li {border: 0;border-left: 1px solid #eceaeb;}
  .navbar-collapse.action-section.show {right: 0;left: auto}
}

.relatechange-icon {width: 48px;height: 48px;display: flex;align-items: center;justify-content: center;}
.navbar-collapse.chat-view {position: absolute;top: 0;right: -75%;padding-bottom: 15px;height: 100%;min-height: 100%;z-index: 1041;-webkit-box-shadow: -2px 0px 5px 1px rgba(0, 0, 0, 0.1);box-shadow: -2px 0px 5px 1px rgba(0, 0, 0, 0.1);overflow-y: auto;-webkit-transition: right .25s ease-out;-moz-transition: right .25s ease-out;-o-transition: right .25s ease-out;transition: right .25s ease-out;}
.navbar-collapse.chat-view.collapsing {right: -75%;transition: right .25s ease-out;}
.navbar-collapse.chat-view.show {right: 0;}

/*Chat Section*/
#chat {position: relative;}
#chat>span {position: absolute;right: 0px;top: -2px;background: #ff0000;height: 6px;border-radius: var(--radius-none).25rem;width: 6px;border: 1px solid #fff;}
.chat-overlay {position: fixed;top: 0;left: 0;z-index: 1040;width: 100vw;height: 100vh;background-color: #000;display: none;}
.chat-overlay.fade {opacity: 0;transition: opacity .1s linear;}
.chat-overlay.show {display: block;opacity: 0.5;}
.chat-view .navbar-nav {flex-direction: row;}
.chat-view .navbar-nav .dropdown-toggle::after {display: none;}
.chat-heading,.service-heading {line-height: 43px;margin: 0;font-weight: bold}
.chat-view .navbar-nav .nav-link,.service-details-view .navbar-nav .nav-link {padding-left: 1rem;padding-right: 1rem;line-height: 30px;}
.invited-users-list .dropdown-item {padding: .25rem .5rem;line-height: 28px;}
.invited-users-list .dropdown-item .user-image {width: 24px;float: left;margin-right: 8px}
.invited-users-list .dropdown-item .user-image>img {width: 100%;}
.invited-users-list .dropdown-item .username {width: calc(100% - 34px);display: inherit;}
.invited-users-list .dropdown-item:last-child:hover {background-color: inherit;}
.ChatBotContainer {padding: 0 0 30px 0;bottom: 72px;top: 43px;position: absolute;overflow-x: hidden;overflow-y: auto;left: 0;right: 0;}
.ChatBotList {list-style: none;padding: 0;margin: 0;overflow: hidden;width: 100%}
.ChatBotList>li {overflow: hidden;padding: 0px 16px 16px 16px}
.ChatBotList>li:not(:first-child) {padding: 16px}
.ChatBotList li .profilePicture {float: left;width: 30px;}
.ChatBotList li.sendChat {text-align: right;}
.ChatBotList li.sendChat .profilePicture {float: right;width: 30px;}
.ChatBotList li.sendChat .profilePicture img {max-width: 100%;box-shadow: 0 2px 4px 0 rgba(204, 191, 191, 0.50);border-radius: 50%;}
.ChatBotList li .profilePicture img {max-width: 100%;box-shadow: 0 2px 4px 0 rgba(204, 191, 191, 0.50);border-radius: 50%;}
.ChatBotList li .chatText {margin: 0 36px;display: block;position: relative;}
.ChatBotList li .chatText>div {background: #f9f9f9;max-width: 100%;position: relative;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.12);color: #46454C;text-align: left;padding: 15px;display: inline-block;border-radius: 10px}
.ChatBotList li .chatText>div>p:first-of-type {display: flex;flex-direction: row;}
.ChatBotList li.sendChat .chatText>div {background: #d6eaf7;}
.ChatBotList li .chatText>div .user-name {font-weight: bold;font-size: var(--body-3);}
.ChatBotList li.sendChat .chatText>div .user-name {display: none;}
.ChatBotList li .chatText p {margin: 0;}
.ChatBotList li .chatText .messagetime {font-weight: 500;float: right;font-size: var(--body-3);}
.chat-seperator {position: relative;text-align: center;}
.chat-seperator:after {position: absolute;top: 50%;left: 0;width: 100%;height: 1px;background: #dee2e6;content: "";z-index: 0;}
.chat-seperator span {background:var(--background-base);padding: 0.25rem;font-size: var(--body-3);z-index: 1;position: relative;}
/*------ Chat Bot footer-------*/
.Chatfooter {position: absolute;bottom: 0;width: 100%}
.Chatfooter .ChatBotFooter {background: var(--background-base);position: relative;-webkit-transition: all .6s ease-in-out;-moz-transition: all .6s ease-in-out;-ms-transition: all .6s ease-in-out;-o-transition: all .6s ease-in-out;transition: all .6s ease-in-out;margin: 20px 16px;display: flex;}
.formSectionBox {width: 100%}
.Chatfooter .StartChat {position: relative;border-radius: 25px;border: 1px solid var(--border-borderbase);}
.Chatfooter .ChatBotFooter .inputBox {background: var(--background-base);outline: none;padding: 12px 20px;border-radius: 25px 0 0 25px;border: 0;color: #000;line-height: 1.4;border-top: 1px solid var(--border-borderbase);width: calc(100% - 50px);height: 40px;}
.inputBox:focus {border-bottom: 1px solid var(--border-borderbase) !important;box-shadow: none !important;}
.Chatfooter .StartChat .sendChat {position: absolute;right: 0;font-size: 0;overflow: hidden;background: transparent;background-size: 20px;width: 50px;top: 0;bottom: 0;border: 0;outline: none;cursor: pointer;}
.lucy-chat {border-radius: 50%;width: 48px;height: 42px;border: 0;text-align: center;box-shadow: 0px 1px 6px #0000004f;background: var(--background-base);animation: slideInRight .75s ease-in-out forwards}
.lucy-chat:focus {box-shadow: 0px 1px 6px #0000004f !important;}
/*Chat Section End*/

/* Historical View Section */
.percantage-chart {width: 40px}
.circular-chart {display: block;margin: 0 auto;max-width: 100%;max-height: 100%;}
.circle-bg {fill: none;stroke: #c1c1c1;stroke-width: 3.8;}
.circle {fill: none;stroke-width: 2.8;stroke-linecap: round;animation: progress 1s ease-out forwards;}
@keyframes progress {
  0% {stroke-dasharray: 0 100;}
}
.percentage {fill: #666;font-family: sans-serif;font-size: var(--body-2);text-anchor: middle;}
.circular-chart.primary .circle {stroke: var(--primary);}
.circular-chart.danger .circle {stroke: #dc3545;}
.circular-chart.orange .circle {stroke: #ff9f00;}
.circular-chart.green .circle {stroke: var(--background-positive);}
.circular-chart.blue .circle {stroke: #3c9ee5;}
.frequency-radio-btn {display: inline-block;}
.frequency-radio-btn input[type=radio] {display: none;}
.frequency-radio-btn input[type=radio]:not(:disabled)~label {cursor: pointer;}
.frequency-radio-btn input[type=radio]:disabled~label {color: hsla(150, 5%, 75%, 1);border-color: hsla(150, 5%, 75%, 1);box-shadow: none;cursor: not-allowed;}
.frequency-radio-btn label {font-size: var(--body-1);font-weight: normal;height: 100%;display: block;color: #212529;background: white;border: 1px solid rgb(211, 211, 211);margin-bottom: 1rem;text-align: center;box-shadow: 0px 3px 1px -2px rgb(0 0 0 / 20%);position: relative;}
.frequency-radio-btn input[type="radio"]:checked+label {background: var(--primary);color: #fff;}
.customAlert.customAlert-success{color: rgb(30, 70, 32);  background-color: rgb(237, 247, 237);}
.customAlert.customAlert-info{color: rgb(1, 67, 97);  background-color: rgb(229, 246, 253);}
.customAlert.customAlert-warning{color: rgb(102, 60, 0);  background-color: rgb(255, 244, 229);}
.customAlert.customAlert-danger{ color: rgb(95, 33, 32);  background-color: rgb(253, 237, 237);}
.customAlert{position: fixed;margin: auto;transform: translate(-50%,0px);left: 50%;top: 80px;transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;border-radius: 4px;box-shadow: none;font-weight: 400;font-size: 0.875rem;line-height: 1.43;letter-spacing: 0.01071em;padding: 14px 16px;min-width: 400px;z-index: 9;display: none;}
.customAlert > .myicons{position: absolute;top: 16px;left: 14px;}
.customAlert.customAlert-success > .myicons{color: rgb(46, 125, 50);}
.customAlert.customAlert-info > .myicons{color: rgb(2, 136, 209);}
.customAlert.customAlert-warning > .myicons{color: rgb(237, 108, 2);}
.customAlert.customAlert-danger > .myicons{color: rgb(211, 47, 47);}
.customAlert .customAlert-content{padding: 0 20px 0px 0;position: relative;width: 100%;}
.customAlert .customAlert-content button{position: absolute;top: -4px;margin: auto;right: -10px;background: transparent;}
/*Horizontal Timeline Start*/
.timeline {list-style-type: none;display: flex;align-items: center;justify-content: start;}
.li {transition: all 200ms ease-in;min-width: 203px;}
.timestamp {margin-bottom: 2rem;padding: 0px 40px;display: flex;flex-direction: column;align-items: center;font-weight: 100;}
.timeline .status {padding: 0px 40px;display: flex;justify-content: center;border-top: 2px solid #D6DCE0;position: relative;transition: all 200ms ease-in;}
.timeline .status h4 {font-weight: 500;margin-top: 2rem;}
.timeline .status:before {content: "";width: 3rem;height: 3rem;background-color: white;border-radius: 1.5rem;border: 1px solid var(--border-borderbase);position: absolute;top: -1.5rem;left: 42%;transition: all 200ms ease-in;}
li.event .status:after,
li.actionable .status:after,
li.alerts .status:after {content: "";width: 20px;height: 20px;position: absolute;top: -10px;left: 50%;margin-left: -3px;}
.li.complete .status {border-top: 2px solid var(--primary);}
.li.complete .status:before {background-color: var(--background-primary);border: none;transition: all 200ms ease-in;}
.li.complete .status h4 {color: var(--content-primary);}
.entity {font-weight: bold;}
.timestamp .date {font-size: var(--body-2)}
@media (min-device-width: 320px) and (max-device-width: 700px) {
  .timeline {list-style-type: none;display: block;}
  .li {transition: all 200ms ease-in;display: flex;width: inherit;}
  .timestamp {width: 100px;}
  .status:before {left: -8%;top: 30%;transition: all 200ms ease-in;}
}
/*Horizontal Timeline End*/

/*Timeline vertical Start*/
::selection {color: var(--content-contentbase)!important;background:var(--background-primary);}
.comment-wrapper {max-width: 1080px;margin: 0 auto;padding: 0 20px;position: relative;}
.comment-wrapper.customer-creation{max-width:400px; padding-bottom: 60px;}
.comment-wrapper .center-line {position: absolute;height: 100%;width: 0.25rem;background: #f1f1f1;left:30px;top: 20px;transform: translateX(-50%);}
.comment-wrapper.customer-creation .center-line{height:auto;bottom: 30px;}
.comment-wrapper .row {display: flex;margin-bottom: 10px;}
.comment-wrapper .row-1 {justify-content: flex-start;}
.comment-wrapper .row-2 {justify-content: flex-end;}
.comment-wrapper .row section {background: #f1f1f1;border-radius: 5px;width: calc(100% - 60px);padding: 20px;position: relative;}
.comment-wrapper .row section::before {position: absolute;content: "";height: 15px;width: 15px;top: 28px;transform: rotate(135deg);border-top: 12px solid #f1f1f1;border-left: 12px solid #f1f1f1;border-bottom: 12px solid transparent;border-right: 12px solid transparent;z-index: 1;}
.comment-wrapper .row-2 section::before {border-bottom: 12px solid #f1f1f1;border-right: 12px solid #f1f1f1;}
.comment-wrapper.customer-creation .row-2 section::before{display: none;}
.row-1 section::before {right: -7px;}
.row-2 section::before {left: -7px;}
.row section .icon,.center-line .scroll-icon {position: absolute;background: #f2f2f2;height: 40px;width: 40px;text-align: center;line-height: 40px;border-radius: 50%;color: var(--content-primary);font-size: var(--body-1);box-shadow: 0 0 0 4px #fff, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);}
.center-line .scroll-icon {bottom: 0px;left: 50%;font-size: var(--heading-3);transform: translateX(-50%);}
.row-1 section .icon {top: 15px;right: -60px;}
.row-2 section .icon {top: 15px;left: -60px;}
.row section .details,.row section .bottom {display: flex;align-items: center;justify-content: space-between;}
.row section .bottom {font-size: var(--body-2)}
.row section .details .title {font-size: var(--body-1);font-weight: bold;}
.row section .details .date {font-weight: bold}
.row section p {margin: 0px 0 17px 0;}
.row section .bottom a {text-decoration: none;background: var(--background-primary);color: #fff;padding: 7px 15px;border-radius: 5px;font-weight: 400;transition: all 0.3s ease;}
.row section .bottom a:hover {transform: scale(0.97);}
.timeline-wrapper .row section p {margin: 10px 0 17px 0;}
.row section .icon::after,.row.actionables section .icon::after,.row.alerts section .icon::after,.row.events section .icon::after,
.scroll-icon::after {content: "";width: 20px;height: 20px;position: absolute;top: 50%;left: 50%;margin-left: -10px;margin-top: -10px;}
.scroll-icon::after {margin-left: -6px;margin-top: -7px;}
.row.disabled-state section div,.row.disabled-state section p,.row.disabled-state section span{opacity: 0.7;}
@media (max-width: 790px) {
  .comment-wrapper .center-line {left: 40px;}
  .comment-wrapper .row {margin: 30px 0 3px 60px;}
  .comment-wrapper .row section {width: 100%;}
  .row-1 section::before {left: -7px;right: auto;transform: rotate(-45deg) !important;border-top: 12px solid transparent;border-left: 12px solid transparent;border-bottom: 12px solid #f1f1f1 !important;border-right: 12px solid #f1f1f1 !important;}
  .row-1 section .icon {left: -60px;}
}
@media(max-width: 440px) {
  .comment-wrapper .center-line,.row section::before,.row section .icon {display: none;}
  .comment-wrapper .row {margin: 10px 0;}
}
/*Timeline vertical End*/

/*Update Available button*/
.update-available.dropup .update-available-btn.dropdown-toggle::after,.update-available .dropstart .dropdown-toggle::before {display: none;}
.update-available {bottom: 20px;right: 20px;border-radius: 50%;width: 60px;height: 60px;border: none;z-index: 1042;animation: slideInRight .5s ease-in-out forwards;background: var(--background-base);}
@-webkit-keyframes slideInRight {
  from {transform: translate3d(100%, 0, 0);visibility: visible}
  to {transform: translate3d(0, 0, 0)}
}
@keyframes slideInRight {
  from {transform: translate3d(100%, 0, 0);visibility: visible}
  to {transform: translate3d(0, 0, 0)}
}
.update-available>button {border-radius: 50%;width: 60px;height: 60px;color: #000;border: none;box-shadow: 0 0 20px rgb(0 0 0 / 20%);transition: all 0.3s;position: relative;display: flex;flex-direction: column;font-size: var(--body-3);align-items: center;font-weight: bold;}
.update-available>button svg {margin: 0 auto 0.25rem;}
.update-available-btn>span.notification-count {position: absolute;left: 10%;bottom: 50px;background: #ff0000;min-height: 6px;border-radius: var(--radius-none).25rem;min-width: 6px;color: #fff;padding: 0.25rem;font-size: var(--body-3);line-height: 10px;margin-left: 0;}
.update-available:focus {background: #ddd;box-shadow: 6px 6px 8px #0003 !important;}
.ripple {background: transparent radial-gradient(closest-side at 50% 50%, rgba(12, 105, 176, 0) 0%, rgba(12, 105, 176, 0.043137254901960784) 47%, rgb(12 105 176 / 6%) 75%, rgb(12 105 176 / 11%) 100%) 0 0 no-repeat padding-box;position: absolute;width: 84px;height: 84px;z-index: -7;left: 50%;top: 50%;opacity: 0;margin: -42px 0 0 -42px;border-radius: 50%;animation: ripple 2s infinite;}
@-webkit-keyframes ripple {
  0% {opacity: 1}
  25% {opacity: 1;transform: scale3d(0, 0, 0)}
  50% {opacity: 0;transform: scale3d(0.1, 0.1, 0.1)}
  to {opacity: 1}
}
@keyframes ripple {
  0% {opacity: 1}
  25% {opacity: 1;transform: scale3d(0, 0, 0)}
  50% {opacity: 0;transform: scale3d(0.1, 0.1, 0.1)}
  to {opacity: 1}
}
.update-available:hover {background: var(--background-base);}
.update-available:hover .ripple {animation: ripple 0s infinite;}
.update-available ul {margin: 0;padding: 0;list-style-type: none;}
.update-available>#updateOptions {width: 48px;min-width: 48px;text-align: center;margin: 0 6px !important;background: none;border: 0;}

.update-available #updateOptions .dropdown-item { border-radius: 50%;width: 48px;height: 48px;border: none;box-shadow: 0 0 20px rgb(0 0 0 / 30%);text-align: center;margin: auto;line-height: 36px;}
#updateOptions li {margin-bottom: 10px;background: var(--background-base);border-radius: 50%;}
.update-available #setIntervalOptions {min-width: 100px !important;background: var(--background-base);box-shadow: 0 0 20px rgb(0 0 0 / 30%);}
.update-available #setIntervalOptions>li {margin-bottom: 0}
.update-available #setIntervalOptions .dropdown-item {display: block;border-radius: var(--radius-none);box-shadow: none;height: auto;width: 100%;line-height: normal;}
/*Update Available button End*/

/* Sortable and item searched */
#sortable,#itemSearch {list-style-type: none;margin: 0;padding: 0;display: block;}
#sortable li,#itemSearch li {float: left;cursor: move;background: var(--background-base) url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2010.25%2017.54'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill:%236b6b6b;}%3c/style%3e%3c/defs%3e%3cg%20id='Layer_2'%20data-name='Layer%202'%3e%3cg%20id='Layer_1-2'%20data-name='Layer%201'%3e%3cpolygon%20class='cls-1'%20points='5.13%200%2010.25%205.13%209.53%205.85%205.13%201.45%200.72%205.85%200%205.13%205.13%200'/%3e%3cpolygon%20class='cls-1'%20points='5.13%2017.54%200%2012.41%200.72%2011.69%205.13%2016.09%209.53%2011.69%2010.25%2012.41%205.13%2017.54'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e") no-repeat 10px center;background-size: 10px;overflow: hidden;text-overflow: ellipsis;white-space: inherit;min-width: 100px;padding: 0.25rem 0.5rem;padding-left: 36px;border: 1px solid var(--border-borderbase);color: #056aa5;border-radius: 2px;margin-right: 10px;margin-bottom: 10px;}
#itemSearch li {background: var(--background-base);padding: 0.25rem 0.5rem;}
#sortable li.static {cursor: default;background: #e9ece7 url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2010.25%2017.54'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill:%236b6b6b;}%3c/style%3e%3c/defs%3e%3cg%20id='Layer_2'%20data-name='Layer%202'%3e%3cg%20id='Layer_1-2'%20data-name='Layer%201'%3e%3cpolygon%20class='cls-1'%20points='5.13%200%2010.25%205.13%209.53%205.85%205.13%201.45%200.72%205.85%200%205.13%205.13%200'/%3e%3cpolygon%20class='cls-1'%20points='5.13%2017.54%200%2012.41%200.72%2011.69%205.13%2016.09%209.53%2011.69%2010.25%2012.41%205.13%2017.54'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e") no-repeat 10px center;background-size: 10px;}
#sortable li .delete, #itemSearch li .delete {width: 36px;height: 36px;text-align: center;line-height: 8px;margin: -6px -8px -8px 10px;}
#sortable li .delete>svg,#itemSearch li .delete>svg {width: 18px;height: 18px;}
/* Sortable End */
.section-heading {font-size: var(--heading-6);}
.time {color: #888;}
/*Metric Cards*/
.metric-cards .card,
.action-section .card.section1,.action-section .card.section2,
.similar-actions .card {box-shadow: none}
.similar-actions .card.section1 {box-shadow: 12px 11px 16px rgb(0 0 0 / 12%);z-index: 1;}
.similar-actions,.similar-actions .card {height: 100%;}
.metric-card .card-header>span{font-family: var(--family-inter);display: block;}
/*Metric Cards End*/
.service-card:hover, .card-related:hover{  box-shadow: 0 8px 15px 0 rgb(8 8 10 / 20%);}
.service-name,.service-card p {color: #444444}
.service-card .status {width: 0.25rem;height: auto;margin-right: 10px}
.service-details-view {position: absolute;top: 0;right: -70%;padding-bottom: 15px;width: 70%;height: 100%;min-height: 100%;z-index: 1041;-webkit-box-shadow: -2px 0px 5px 1px rgba(0, 0, 0, 0.1);box-shadow: -2px 0px 5px 1px rgba(0, 0, 0, 0.1);overflow-y: auto;-webkit-transition: right .25s ease-out;-moz-transition: right .25s ease-out;-o-transition: right .25s ease-out;transition: right .25s ease-out;}
.service-details-view .navbar-nav,.action-section .card-header {z-index: 9;}
.service-details-view.collapsing {right: -70%;transition: right .25s ease-out;}
.service-details-view.show {right: 0;}
.servicedescription-detail li a {color: #444;}
.similar-actions>div,.similar-actions .section1>.card-body {height: 100%;}
.service-detail-main {overflow-y: auto;height: calc(100% - 152px);}
.service-detail-main .card {height: auto}
.service-details-view .navbar-nav {flex-direction: row;}
.service-detail-main .action-name {line-height: 18px;}
.customer-details-list li:not(:last-child),.service-entity-list li:not(:last-child){margin-bottom: 10px;}
.customer-details-list .list-group-item+.list-group-item,.service-entity-list li .list-group-item+.list-group-item{border-radius: inherit;border-top-width:1px}
#customerTabContent .tab-pane .card .card-header,#customerTabContent .tab-pane .card .card-footer{background-color: var(--background-base);}
#customerTabContent .tab-pane > .card-body{min-height: 178px;}
.topology-chips2 .gbl-chips{padding: 5px 14px;}
.topology-chips2 .gbl-chips span:first-child{margin-right:0.25rem;padding-right:30px;position: relative;}
.topology-chips2 .gbl-chips span:first-child::after{position: absolute;color:#444;content: "";bottom: 21px;right: 0;}
.topology-chips .gbl-chips span:not(:first-child){margin-right:0.25rem;padding-right:30px;position: relative;}
.topology-chips .gbl-chips span:not(:first-child)::after{position: absolute;color:#444;content: "";bottom: 21px;right: 0;}
.notificationtabs{border:none}
.notifications-timelines .row section{padding:0.75rem 1rem}
.jsonparameter{display:none}
.jsonparameter.show{display:block}

.header-parameter.show{display:block}
.advance-options{display:none}
.advance-options.show{display:block}
.advance-options-btn,.advance-options-btn:hover,.advance-options-btn:focus{text-decoration: none;}
.advance-options-btn.hide-advance-option{color:#6d6d6d}
.service-entity-list li{padding: 0;height:41px}
.service-entity-list li>div:last-child{padding:0.25rem 0.25rem 0.25rem 1rem}
.service-entity-parent{line-height: 31px;padding: 0.25rem 16px;background: #dddd;border-radius: 1rem 0 0 1rem;height:41px}
.service-entity-children .gbl-chips{margin-bottom: 0;max-width: 150px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
/*Filters Tree view*/
.base-top-line {width: 20px;height: 2px;background: #9c9c9c;margin-left: -15px;}
.node-tree .row > div{padding:0;}
ul.node-tree, ul.node-tree ul {list-style: none;margin: 2px 0 0 0;padding: 0;} 
ul.node-tree li {margin: 0;padding: 0 0 0 27px;border-left: 2px solid #9c9c9c; margin-left: -6px;position: relative;}
ul.node-tree li:last-child {border-left:0;box-shadow: none;margin-left:-0.25rem;}     
ul.node-tree li:last-child:before {left: -30px;}
ul.node-tree li .node-card{margin:16px 0 0 0;border: 1px solid var(--border-borderbase);}
.filter-collapse{  position: absolute;height: 16px;width: 10px;content: "";display: inline-block;background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2025%2025'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill:%23fff;stroke:%23000;}%3c/style%3e%3c/defs%3e%3crect%20id='Rectangle'%20class='cls-1'%20x='.5'%20y='.5'%20width='24'%20height='24'/%3e%3cg%20id='icon_navigation_subtract_24'%3e%3cg%20id='icon-color'%3e%3crect%20id='path-1'%20x='5.8'%20y='11.8'%20width='13.5'%20height='1.5'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e") no-repeat center center; background-size: 16px;top: 22px;left: -10px;z-index:5;}
.filter-collapse.show{ background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2025%2025'%3e%3cdefs%3e%3cstyle%3e.cls-1{fill:%23fff;stroke:%23000;}%3c/style%3e%3c/defs%3e%3crect%20id='Rectangle'%20class='cls-1'%20x='.5'%20y='.5'%20width='24'%20height='24'/%3e%3cg%20id='icon_navigation_subtract_24'%3e%3cg%20id='icon-color'%3e%3crect%20id='path-1'%20x='5.8'%20y='11.8'%20width='13.5'%20height='1.5'/%3e%3c/g%3e%3c/g%3e%3cg%20id='icon_navigation_subtract_24-2'%3e%3cg%20id='icon-color-2'%3e%3crect%20id='path-1-2'%20x='11.8'%20y='5.7'%20width='1.5'%20height='13.5'/%3e%3c/g%3e%3c/g%3e%3c/svg%3e") no-repeat center center; background-size: 16px;}
.card-rounded-border{position: absolute;top: -21px;height: 36px;width: 18px;content: "";display: inline-block;left: -18px;border-bottom-left-radius: 6px;border-left: 2px solid #9c9c9c;border-bottom: 2px solid #9c9c9c;z-index: 1;}
.node-tree li:last-child .node-card .card-content:before {left: -31px;}
.node-tree li:last-child .node-card .card-content .card-rounded-border {height: 40px;top: -21px;width: 27px;}
.node-card.has-child.open-child{border:1px solid #3f49ab;}
.dropdown-content{overflow: visible !important;}
.node-card .card-action{background: transparent;padding:16px;}
.node-card.open-child .card-rounded-border,
.node-card.open-child .card-content .card-rounded-border{border-left: 2px solid #3f49ab;border-bottom: 2px solid #3f49ab;height: 40px}
ul.node-tree li.sibling-selected{border-left:2px solid #3f49ab;}
ul.node-tree li.sibling-selected > .card-rounded-border{z-index: 2;border-left: 2px solid #3f49ab;}
.selectedpath .card-rounded-border{z-index: 2;border-left: 2px solid #3f49ab;border-bottom: 2px solid #3f49ab;    height: 40px;}
ul.node-tree li .node-card.open-child{border: 1px solid #3f49ab!important;}
.node-card .card-action a:not(.btn){margin-right: 0!important;text-transform: capitalize!important;}
ul.node-tree li:before {position: absolute;top: 0;height: 60px;width: 30px;content: "";display: inline-block;left: -2px;z-index: 2;}
ul.node-tree li.sibling-selected:before {border-left: 2px solid #3f49ab;}
.node-tree li > .node-card .card-content .card-rounded-border{left:-33px;}
.node-card p{margin: 0;color: #000;padding: 8px 10px;}
.node-card .card-action .child_open_node i{margin-right:0px;}
.node-card .card-action .child_open_node{display: inline-block;}
.feature-prepration li .node-card {margin: 0;}
ul.node-tree.feature-prepration li{border-left:0}
ul.node-tree.feature-prepration li:before {display: none;}
.feature-prepration label{margin:0}
ul.feature-prepration.node-tree li .node-card{margin:0 0 16px 0}
/*Filters Tree view End*/
.or{position: relative;}
.or:after{position: absolute;content: "";border-bottom: 1px solid var(--border-borderbase);width: 100%;left: 0;top: 50%;z-index: 0;}
.or span{z-index: 1;padding: 6px;border-radius: 50%;color: #fff;width: 40px;height: 40px;line-height: 20px;font-weight: bold;position: relative;}
.steps .step-count{font-weight: bold;font-size: var(--heading-6);line-height: 14px;color:var(--content-contentsecondary)}
.step-indicator {height:3px}
.step-indicator span{width: 22px;height: 3px;background: #ddd;display: inline-block; font-size: 0;}
.step-indicator span:not(:first-child){margin-left:6px}
.card#general,.card#connection_details, .card#actions{box-shadow: none;}
.input-alert{position: absolute;right: -240px;z-index: 99;width: 220px;border: 0;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.20);top: 0;background: #eeeeee;-webkit-animation-duration: 10s;animation-duration: 10s;-webkit-animation-fill-mode: both;animation-fill-mode: both;display: none;}
.input-alert.left{left:-240px}
.input-alert.show{display: block;}
@-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
@keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
.nav-top {width: 100%;padding: 0px;background: var(--background-base);transition: 0.3s;}
.container-tab {max-width: 100%;margin: 0 auto;}
.w-h {width: 100%;}
.tabing-section .nav-link {color: #4759a8;padding: 1px;margin:0 5px ;}	 
.input-alert.fadeIn {-webkit-animation-name: fadeIn;animation-name: fadeIn;}
.input-alert .input-alert-arrow{border-top: 0.75rem solid transparent;border-right: 0.75rem solid #eeeeee!important;border-bottom: 0.75rem solid transparent;display: block;position: absolute;right: 0;left: -0.75rem!important;top: 20px;margin-top: -0.33rem;border-left: none;width: 0.75rem;}
.input-alert.left .input-alert-arrow{transform: rotate(180deg);left: auto !important;right:-0.75rem}
.input-alert ul{padding:0;margin:0;list-style-position: inside;}
.input-alert ul li{line-height: 20px;}
.input-alert ul li ul{padding-left:10px}
.dt-buttons .btn svg{margin-top:-5px}
.access-cloud-type-card .card-text{height:120px; overflow-y:auto}
.access-cloud-type-card .filter-list li{padding: 0.25rem 0 ;}
.access-cloud-type-card .filter-list li:not(:last-child){border-bottom:1px solid var(--border-borderbase) ;}
#permissionTabsContent .tab-pane{padding:0;}
#permissionTabsContent .card-body{min-height: 345px}
.action-form .card{margin-bottom: 1rem;box-shadow: none;}
.action-form .card-header {border-radius: var(--radius-none);display: block;width: 100%;text-align: left;font-weight: 500;position: relative;letter-spacing: 0.5px;height: 39px;padding:0 0 0 1.5rem;background: transparent;}
#correlationViewTabContent .tab-pane{padding:1rem}
.action-form .card-header a[aria-expanded="false"] > i >svg{transform: rotate(180deg);}
.info-filled{position: relative;}
.objective-details li{padding:0.5rem;}
.objective-details li:not(:first-child){border-top:1px solid var(--border-borderbase)}
.evaluation-score-section{padding: 8px 6px 6px;}
.dataset-name{    font-size: var(--body-1);padding: 6px;background: rgb(5 134 193 / 12%);}
.dataset-name .badge{line-height: normal;}
.evaluated-objectives-list .card{box-shadow:none}
#objectiveTabContent .card-title,#objectiveTabContent .card-header > span{line-height: 30px;}
.compare-button, .compare-iteration-button{display:none;bottom: 60px;right: 20px;border: none;box-shadow: 0 0 20px rgb(0 0 0 / 25%);z-index: 3;animation: slideInRight .5s ease-in-out forwards;}
.dataset-result-section > div:not(:last-child){margin-bottom: .5rem;}
.enabled-objectives-list .card{box-shadow:none}
.enabled-objectives-list > li{min-height: 300px;}
.enabled-objectives-list > li .metric-cards,.enabled-objectives-list > li .card{height:100%}
.evulatedlist{flex-direction: row !important;}
.evulatedlist li{flex: 1; margin: 0 4px;}
.evulatedlist .margin-right{margin-right: 20px;}
.evulatedlist .dataset-name span{ font-size: var(--body-1);}
.evulatedlist .dataset-name{background: none !important;  position: absolute;  left: 0;  bottom: 4px;}
.evulatedlist .aligntxt{text-align: right;}
.evulatedlist .objective-detail .objective-detail-value>span {font-size: var(--body-1);}
.evulatedlist .objective-detail-value {background:none;border: 0;padding: 0.5rem;border-bottom: solid 1px #eee;}
.evulatedlist .form-check-inline {display: inline-block;margin-right: 0px;}
.evulatedlist .brdr-bot{border-bottom: none;}
.cust-date-box {margin: 30px 0 0;align-items: right;text-align: right;overflow: hidden;display: flex;justify-content: right;}
.bg-wth {padding: 21px 8px;}
.card-heading {font-size: var(--body-3);color: #212529;}
.card-digits {margin: 0px;padding: 0px;list-style: none;}
.card-digits li {color: #5e81f4;display: inline-block;font-size: var(--heading-5);width: 60%}
.card-digits li:last-child {width: 37%;line-height: 0;text-align: right;}
.card-p {font-size: var(--body-3);}
.card-heading img {float: right;}
.m_info {width: 18px;}
.hdr-part {display: flex;align-items: center;justify-content: space-between;}
.hdr-part h2 {font-size: var(--body-1);}

#adj-flex-form .form-inline {display: flex;-webkit-box-flex: 0;flex: 0 0 auto;-webkit-box-orient: horizontal;-webkit-box-direction: normal;flex-flow: row wrap;-webkit-box-align: center;align-items: center;margin-bottom: 0px;}
.reportrange {border-radius: 8px;width: auto;align-items: center;display: flex !important;border: 1px solid;border-color: var(--border-borderbase);background-color: var(--background-bgcard);color: var(--content-contentsecondary);}

#adj-flex-form .input-group-append {display: flex;margin-left: -1px;}
.reportrange .input-group-text, .reportrange .form-control {background-color: transparent;border-top: 0px;border-right: 0px;border-left: 0px;border-image: initial;border-bottom: none;border-radius: var(--radius-none)px;cursor: pointer;height: auto;box-shadow: none;line-height: inherit;color: var(--content-contentsecondary);text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}
/* #componentslogslist td, */
#jobdetailsList td{vertical-align: top;}
.overflow-wrap{white-space: normal; word-break: break-all;}
#viewDetailsModal .modal-header{display: block;}
/* Modal  type2 End */

/* orgAdmin Start*/
.metric-cards .card-header, .metric-cards .card > .card-header{font-size:16px ;font-weight: bold;background: none;border: 0;font-family: var(--family-inter);color:var(--content-contentsecondary)}
.metric-cards .card-header, .metric-cards .card > .card-header h3{font-size: 1.6em;}
.card-header >div,.card-header >span,.card-header > a{font-family: var(--family-inter);}
.widget-more-options span:not(:first-child){border-left:1px solid var(--border-borderbase)}
.widget-more-options .btn{color:var(--content-contentsecondary)}
.widget-more-options button::after{display: none;}

.pro-c{font-size: min(2.75em, 46px);}

.filter-section{background: var(--background-light);}
.resolution-div{display: none;}
.bg-in{background-color: #5470c6 !important;}
.bg-cr{background-color: #91cc75 !important;}
.bg-sr{background-color: #fac858 !important;}
.bg-ev{background-color: #ef6666 !important;}
.analysisdetails-data { width: 100%;display: flex;flex-direction: row;flex-wrap: wrap; }
.analysisdetails-data li {width:100%;min-width: 100%; font-family: var(--family-inter);  -webkit-box-flex: 1;-ms-flex: 1;flex: 1;padding: 0.75rem 0;margin:0;position: relative;color:var(--content-contentbase)}
.analysisdetails-data li span { display: block; font-weight: 600;  margin-bottom: 6px; color:var(--content-contentsecondary)}
.analysisdetails-data.inner li {width:23%;min-width: 23%;}
.analysisdetails-data.inner li::after{display: none;}
.analysisdetails-data.inner li:not(:first-child)::before{content: "";position: absolute;width: 1px;height:100%; left:-0.75rem; top:0; bottom:0;background-color: #eceaeb;}
.analysisdetails-data li:nth-child(1)::after,.analysisdetails-data li:nth-child(2)::after{content: "";position: absolute;height: 1px;width:100%; left:0;right:0; bottom:-0.75rem;background-color: var(--border-borderbase); display:none}
.analysisdetails-data li:nth-child(2)::before,.analysisdetails-data li:nth-child(4)::before{content: "";position: absolute;width: 1px;height:100%; left:-0.75rem; top:0; bottom:0;background-color: var(--border-borderbase);display:none}
.analysisdetails-data li:not(:last-child){border-bottom: 1px solid var(--border-borderbase);}
@media(min-width:1580px){
  .analysisdetails-data li{margin:0.75rem;width:42%;min-width: 42%; }
  .analysisdetails-data li:not(:last-child){border-bottom:0}
  .analysisdetails-data li:nth-child(1)::after,.analysisdetails-data li:nth-child(2)::after{content: "";position: absolute;height: 1px;width:100%; left:0;right:0; bottom:-0.75rem;background-color: var(--border-borderbase); display: block;}
  .analysisdetails-data li:nth-child(2)::before,.analysisdetails-data li:nth-child(4)::before{content: "";position: absolute;width: 1px;height:100%; left:-0.75rem; top:0; bottom:0;background-color: var(--border-borderbase);display: block;}
}
/* Slider Start */
.slider {margin: 0;display: flex;}
.min-value,.max-value {color: #6c6d70;text-align: right;font-weight: bold;display: none;}
.max-value {text-align: left;}
.current-value {position: absolute;top: -3.5em;left: 50%;width: 36px;height: 30px;text-align: center;color: #fff;white-space: nowrap;background: #000;padding: 6px;border-radius: 6px;line-height: 20px;}
.current-value::after{    position: absolute;content: "";border-width: 8px 6px 0 6px;border-color: #000 transparent transparent;border-style: solid;bottom: -8px;left: 50%;margin-left: -4px;}
.range {position: relative;float: left;width: 100%;padding: 0 0.9375rem;margin: 0 16px;}
input[type=range] {-webkit-appearance: none;appearance:none;display: block;width: 100%;height: 16px;padding: 0;border-radius: 8px;background: #c4c5c5;box-sizing: content-box;}
input[type=range]:focus {outline: none;}
input[type=range]::-webkit-slider-thumb {-webkit-appearance: none;width: 24px;height: 24px;border: 2px solid var(--primary);border-radius: 50%;background: var(--background-primary);}
input[type=range]::-webkit-slider-thumb:before {content: attr(data-count);display: block;background:var(--background-primary);width: 16px;height: 16px;}
/* Slider End */

.repotype {display: none;}
.w-100vh{height: 100vh}
.showListAccordingValue{display:none;}  
.showListAccordingValue1{display:none;} 
.seprate_section{width: 100%}
.week-days, .depth-level{margin-bottom: 6px;}
.week-days li, .depth-level li{display: inline-block;margin-left: 6px;}
.week-days li button, .depth-level li button{background-color: #ededed;color: var(--content-primary); border-radius: 50%; width:36px;height:36px;border:1px solid #e6e6e6; }
.week-days li button:hover,.week-days li button.active, .depth-level li button:hover,.depth-level li button.active{background-color: var(--background-primary);color:#fff; border:1px solid var(--background-primary)}
/* Knowledge Search Start */
#searchAdvanceSection{background: var(--background-light);}
.repo-filter {margin-right: 0px}
.repo-filter ul {background-color: var(--background-light);border: 1px solid var(--border-borderbase);border-radius: 18px;padding: 1px;align-items: flex-start;    flex-wrap: wrap;}
.repo-filter .badge {padding: 11px 13px;font-weight: normal;cursor: pointer;color: var(--content-contentsecondary);}
.repo-filter .myicons{font-size: 0.85rem;}
.repo-filter .badge.bg-light.active {background-color: var(--background-primary) !important;color: #ffffff !important;}
.repo-filter .badge:first-child {
  padding: 10px 13px;
}
.repo-filter .legend{width: 10px;height: 10px;display: inline-block;border-radius: 50%;margin-right: 10px;background-color:#ddd;border:1px solid #fff;vertical-align: bottom;}
.repo-filter .legend.web{background-color: #cc7717;}
.repo-filter .legend.filefolder{background-color: #3f51b5;}
.repo-filter .legend.satori{background-color: #7a13df;}
.repo-filter .legend.servicenow{background-color: #26e69a;}
.knowledgeSearchResult{width:100%; float:left;min-height:200px;}
.search-result{line-height: 36px;margin: 0;font-size: 1.2em;font-weight: 400;}
.knowledgeSearchResult .info-box{border: 1px solid var(--border-borderbase);margin: 0.5rem 0 0 0;padding:0.5rem 1rem;border-radius: var(--radius-none).2rem;width:100%}

.knowledgeSearchResult .info-box:nth-child(odd){background:var(--background-light)}
.knowledgeSearchResult .info-box-content{margin-left:0}
.info-box-text-heading{font-size:var(--body-1); font-weight:bold}
.info-box-text-heading a{font-size: var(--body-2)}
.view-more{position: absolute;right: 0;top: 0;border: 1px solid var(--border-borderbase);border-radius: 50%;padding: 4px;line-height: 1;} 
.knowledgeSearchResult .info-box-text{text-transform:none;display: block;position: relative; padding-right: 100px;}
.info-box-text .description{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;line-height: 30px;display: block;width:100%;}
.info-tags{border-top:1px solid #d1d6da;margin-top:0.5rem; padding:6px 0 0 0}
.info-tags .badge{    line-height: 1;  border: 0;  letter-spacing: 0.6px;}
.info-box.web{border-left:4px solid #cc7717}
.info-box.filefolder{border-left:4px solid #3f51b5}
.info-box.satori{border-left:4px solid #7a13df}
.info-box.servicenow{border-left:4px solid #26e69a}
#myFavSearch{position: relative;margin-bottom:20px}
#myFavSearch::after{position: absolute;content:""; bottom: -10px;left:50%; width:280px; height: 2px; margin-left:-140px;background-color: var(--background-primary);}
.top-repo-filter{max-width:fit-content; margin: 0 auto 1rem;}
.top-repo-filter ul{background-color: transparent;border:0;}
.top-repo-filter .badge:not(:first-child){margin-left: 6px;}
.myfav{border-radius:1rem 0 0 1rem!important}

/* Knowledge Search End */
/* QuickView */
.quickview-popup {left: 0;position: absolute;display: none; height: 420px; min-width: 320px;color: #222;background: var(--background-base);-webkit-box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);-moz-box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);font-family: Arial, Helvetica, sans-serif;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;user-select: none;-o-user-select: none;-moz-user-select: none;-khtml-user-select: none;-webkit-user-select: none;-ms-user-select: none;z-index: 9;text-align: left;border-radius: 6px;-moz-border-radius: 6px;-webkit-border-radius: 6px;-moz-background-clip: padding;-webkit-background-clip: padding-box;background-clip: padding-box;text-rendering: optimizelegibility;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;line-height: 1.2;-webkit-transition: all 1s ease-in .5s;-moz-transition: all 1s ease-in .5s;-ms-transition: all 1s ease-in .5s;-o-transition: all 1s ease-in .5s;transition: all 1s ease-in .5s;}
.quickview-heading{line-height: 24px;}
.quickview-title{ line-height: 42px;padding-left: 1rem;font-weight: bold;}
.quickview-popup.quickview-active,
.quickview-popup.active {display: block;}
.quickview-btn {background: transparent;color: #333;-moz-outline: 0;outline: none;border: 0;line-height: 1;cursor: pointer;text-align: left;margin: 4px 2px;padding: 0;-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-ms-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;border-radius: 4px;-moz-border-radius: 4px;-webkit-border-radius: 4px;-moz-background-clip: padding;-webkit-background-clip: padding-box;background-clip: padding-box;z-index: 2;position: relative;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;text-decoration: none;user-select: none;-o-user-select: none;-moz-user-select: none;-khtml-user-select: none;-webkit-user-select: none;-ms-user-select: none;float: left;height: 36px;width: 36px}
.quickview-btn:focus,.quickview-btn:hover,.quickview-btn:active {background: #ebebeb;}
.quickview-separator {background: #ebebeb;display: block;clear: both;width: calc(100% - (2 * 4px));margin: 0 4px;height: 1px;}
.quickview-content{width:100%;height: calc(100% - 44px);}
/* QuickView End*/
.tickets-knowledge-search{padding:16px 0}
.tickets-knowledge-search .input-group .btn{min-width:auto}
#knowledgeSearch.tab-pane{padding-top:0}
#allTicketList.table tr td,#myTicketList.table tr td,#autoTicketList.table tr td, .k-grid td{vertical-align: top;}
.ticket-name, .ticket-description, .ticket-time{ font-size:var(--body-1);   text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
.ticket-name{font-size: var(--heading-6);font-family: var(--family-inter);color: var(--content-contentbase);}
#viewTicketDetailsModal .modal-content,
#viewReleasedTicketDetailsModal .modal-content,
#viewhealingTicketDetailsModal .modal-content,
#selectRunbookDetailsModal .modal-content,
#knowledgeGuideDetailsModal .modal-content,
#viewrelatedTicketDetailsModal .modal-content,
#viewLogDetailsModal .modal-content,
#approvalTemplateCreationModal .modal-content{overflow:inherit}
#viewTicketDetailsModal .btn-close,
#viewReleasedTicketDetailsModal .btn-close,
#viewhealingTicketDetailsModal .btn-close,
#selectRunbookDetailsModal .btn-close,
#knowledgeGuideDetailsModal .btn-close,
#viewrelatedTicketDetailsModal .btn-close,
#viewLogDetailsModal .btn-close{position: absolute;left: -2rem;background: #ff0000;top: 24px;border-radius: 4px 0 0 4px;opacity: 1;color:#fff}
#viewTicketDetailsModal .btn-close > svg,
#viewReleasedTicketDetailsModal .btn-close > svg,
#viewhealingTicketDetailsModal .btn-close > svg,
#selectRunbookDetailsModal .btn-close > svg,
#knowledgeGuideDetailsModal .btn-close > svg,
#viewrelatedTicketDetailsModal .btn-close > svg,
#viewLogDetailsModal .btn-close > svg{ margin-top: -10px;}
#allTicketList .k-detail-row .k-grid-header{display: none;} 
#allTicketList .k-detail-cell > div,
#allTicketList .k-detail-cell .k-grid tr:hover,
#allTicketList .k-detail-cell .k-alt,#allTicketList .k-detail-row.k-alt{background-color: transparent;}
#allTicketList .k-detail-cell .k-master-row >td{border:0}

#allTicketList td,
#myTicketList td,
#releasedTicketList td,
#autoTicketList td{padding:20px 10px}
.all-ticket-actions{margin-bottom:14px}

.all-ticket-actions li button{padding:6px 10px;line-height: 1;    color: #767676;}
.viewTicketDetails.btn-outline-primary{padding: 6px;line-height: 1.5;}

.tc-details { display: flex; flex-flow: wrap; justify-content: space-between; margin: 13px 13px 0px; }
.tc1 { width: 100%; background-color: var(--background-light); padding: 25px 10px; margin-bottom: 13px; text-align: center; border: 1px solid var(--border-borderbase2);}
.tc1 h2 { font-size: var(--body-1); color: var(--content-contentbase); margin: 0px; padding: 0px; }
.tc { width: 49%; background-color: var(--background-light); padding: 17px 10px; margin-bottom: 13px;border: 1px solid var(--border-borderbase2); }
.tc h2 { font-size: var(--body-1); color:var(--content-contentbase); margin: 0px; padding: 0px; }
.tc h2 span { font-size: var(--heading-3); color: var(--text-primary); display: block; padding-top: 5px; }
.bg-anlys {background: var(--background-light);}
.top-anlysic {width: 100%;display: flex;padding: 1rem 0.75rem;border-bottom: 1px solid var(--border-borderbase2);}
.anlysc-data {width: 70%;display: flex;flex-wrap: wrap;}
.anlysc-chart { width: 30%; }
.any-name {width: 75%;font-size: var(--body-2);margin-bottom: 0.5rem;}
.anys {width: 25% !important;}
.any-name span {display: block;font-weight: 500;font-size: var(--body-2);}
.pro-graph span { font-size: var(--body-3); text-align: center; padding-bottom: 10px; display: block; }
.text-ellip2 {white-space: nowrap;width: 78%;overflow: hidden;text-overflow: ellipsis;}
.pro .progress { width: 76px; height: 76px;  background: none; margin: 0px auto; box-shadow: none; position: relative; }
.pro .progress::after { content: ""; width: 100%; height: 100%; border-radius: 50%; border: 12px solid var(--border-borderbase); position: absolute; top: 0px; left: 0px; }
.pro .progress span { width: 50%; height: 100%; overflow: hidden; position: absolute; top: 0px; z-index: 1; }
.pro .progress .progress-left { left: 0px; }
.pro .progress .progress-bar { width: 100%; height: 100%; background: none; border-width: 12px; border-style: solid; position: absolute; top: 0px; }
.pro .progress .progress-left .progress-bar { left: 100%; border-top-right-radius: 80px; border-bottom-right-radius: 80px; border-left: 0px; transform-origin: left center; }
.pro .progress .progress-right { right: 0px; }
.pro .progress .progress-right .progress-bar { left: -100%; border-top-left-radius: 80px; border-bottom-left-radius: 80px; border-right: 0px; transform-origin: right center; animation: 1.8s linear 0s 1 normal forwards running loading-1; }
.pro .progress .progress-value { width: 90%; height: 90%; border-radius: 50%; background:#fff; font-size: var(--body-1); color: rgb(18, 91, 98); line-height: 70px; text-align: center; position: absolute; top: 5%; left: 5%; }
.pro .progress.blue .progress-bar { border-color: rgb(38, 195, 211); }
.pro .progress.blue .progress-left .progress-bar { animation: 1.5s linear 1.8s 1 normal forwards running loading-2; }
.pro .progress.yellow .progress-bar { border-color: rgb(38, 195, 211); }
.pro .progress.yellow .progress-left .progress-bar { animation: 1s linear 1.8s 1 normal forwards running loading-3; }
.pro .progress.pink .progress-bar { border-color: rgb(38, 195, 211); }
.pro .progress.pink .progress-left .progress-bar { animation: 0.4s linear 1.8s 1 normal forwards running loading-4; }
.pro .progress.green .progress-bar { border-color: rgb(26, 188, 156); }
.pro .progress.green .progress-left .progress-bar { animation: 1.2s linear 1.8s 1 normal forwards running loading-5; }
@keyframes loading-1 { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(180deg); }
}
@keyframes loading-2 { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(144deg); }
}
@keyframes loading-3 { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(90deg); }
}
@keyframes loading-4 { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(36deg); }
}
@keyframes loading-5 { 
  0% { transform: rotate(0deg); }
  100% { transform: rotate(126deg); }
}

.details-list > li:not(:last-child) {margin-bottom: 1rem;}
.details-list > li > .card {box-shadow: none;border-radius: var(--radius-none);border-color:var(--border-borderbase2);}
.details-list-section {background: var(--steps_content_bg);border: 0;padding:0.5rem 1rem;display: flex;border-bottom: 1px solid var(--border-borderbase);align-items: baseline;color:var(--content-contentbase);}
.service-icon {margin-right: 1rem;padding-right:1rem;line-height: 56px;border-right: 1px solid var(--border-borderbase); color:var(--content-contentbase)}
.service-icon .myicons {font-size: 2rem;}
.details-list-section .details-list-section-value>span{display: block;font-size: 0.85rem;font-size: var(--body-1);margin-bottom: 0px;text-transform: none;color: #6c757d;color:var(--content-contentsecondary);font-weight:normal}
.details-list-section .details-list-section-value .dynamic-value {color: var(--content-contentbase);font-size: var(--heading-6);line-height: 38px;}
@media(max-width:768px){
  .details-list-section{flex-direction: column;align-content: flex-start;flex-wrap: wrap;justify-content: space-evenly;}
  .details-list-section .details-list-section-value .dynamic-value{line-height: 1.5;}
}


.offcanvas-bottom {height: 15vh;}
.tab-default-button .selected-icon{display: none;}
.tab-default-button.active .default-icon{display: none;}
.tab-default-button.active .selected-icon{display: inline-block;}
.tab-default-button.active,.tab-default-button:focus,.tab-default-button.active:focus{border:0!important;color:var(--content-contentsecondary)!important}
.tab-default-button.active svg{color:var(--background-positive)}
.card-body iframe {width:98% !important;margin:0 auto;}

/*Icons setting*/
.iautomate-logo{font-size: 140px;line-height: 0;vertical-align: middle;}
.step-icon .myicons{font-size:2.875em;}
#topNav .myicons{font-size: 1.6em;height: 22px;}
#topNav .top-search .myicons{font-size: 1.4em;}
.small_scale #topNav .top-search .myicons{font-size: 1.3em;}
.btn-sm .myicons {vertical-align: middle;}
.small_scale .btn-sm{font-size: inherit;}
.btn .myicons{font-size: 1.2rem;}
.before-none:before{display: none !important;}

.text-scale{position: relative;}
.print-scale {
  position: absolute;
  top:10px;  right:4px;
  font-size: 12px;
  background-color: var(--background-primary);
  color: var(--content-black);
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  
}
.line_stack {height: 100%;}
.progress.distribution{height: 1.2rem;}
.assignHeight {display: flex;}
.card-flx{display: flex; width: 100%;}
.card-body-iframe {display: contents; padding: 1rem 1rem; height: 100%; width: 100%;}

.footerbg{background: var(--footerbg) !important;}

.dayOneSteps{width: 100%; display: flex; justify-content: space-between; margin-top: 2em;}


.steps_icon{
  width: 72px;
  height: 72px;
  background-image: linear-gradient(270deg, #00F2FE 0%, #4FACFE 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--white);
  margin: 8px auto 22px;
}
.steps_icon .myicons{font-size: 2em;}

.headingTextColor{color: var(--headingTextColor); font-size: 2em;}
.alert-info-text{color:var(--contantstapp)}
.progressStatus {
  width: 22px;
  height: 22px;
  position: absolute;
  top: 10px;
  right: 20px;
}

/* Super Admin */
.card-body-iframe-flex {display: flex; padding: 1rem 1rem; height: 100%; width: 100%; flex-direction: column;}
.line_stack_2{height: 100%; min-height: 400px;}
.card-items{display: flex; flex-direction: column; justify-content: space-between;}
.toast-index{z-index: 9999;}
.cls-2 {fill: none;}


.min-height{height: 107px;}
.progress30{width: 30%;}

#table_section{display: none;}
#rbac{display: none;}
#smtp{display: none;}
.min-height500{min-height: 500px;}
.minHeight200{min-height: 200px;}
.upload-section{display: none;}

.recuringtimes.month{display: none;}
.recuringtimes.year{display: none;}
.recuringtimes.week{display: none;}
#DCRequestAuthParameters{display: none;}
#requestHeaderParameters{display: none;}
.json_upload, .delete-requestBodyValue, .json_uploadResponseBody, .filter_button, .bulk_createrunbook, .edit_runbookParameter, .delete_runbookParameter, .delete-responseBodyValue{display: none;}
#runbookTool_details, #manageRunbook_details, #runbookListSection, #buildModels_details, #userManagement_details{display: none;}

/* MyCloud CSS*/
.catalog-type-filter {margin-right: 0px}
.catalog-type-filter ul {background-color: var(--background-light);border: 1px solid var(--border-borderbase);border-radius: 18px;padding: 1px;align-items: flex-start;height: 39px;}
.catalog-type-filter .badge {padding: 12px 15px;font-weight: normal;cursor: pointer;color: var(--content-contentsecondary);}
.catalog-type-filter .badge.bg-light.active {background-color: var(--background-primary) !important;color: #ffffff !important;}
.catalog-type-filter .legend{width: 10px;height: 10px;display: inline-block;border-radius: 50%;margin-right: 10px;background-color:#ddd;border:1px solid #fff;vertical-align: bottom;}


.legend.iaas,.legend.inprogress{background-color: #cc7717;}
.legend.paas, .legend.all{background-color: #3f51b5;}
.legend.blueprint,.legend.deployed{background-color: #7a13df;}

.catalogSearchResult .catalog-item.most-used .catalog-type span:before{background-color: var(--background-primary);}
.catalogSearchResult .catalog-item.iaas .catalog-type span:before,.catalogSearchResult .catalog-item.inprogress .catalog-type span:before{background-color: #cc7717;}
.catalogSearchResult .catalog-item.paas .catalog-type span:before,.catalogSearchResult .catalog-item.all .catalog-type span:before{background-color: #3f51b5;}
.catalogSearchResult .catalog-item.paas .catalog-type span,.catalogSearchResult .catalog-item.all .catalog-type span,
.catalogSearchResult .catalog-item.iaas .catalog-type span,.catalogSearchResult .catalog-item.inprogress .catalog-type span,
.catalogSearchResult .catalog-item.most-used .catalog-type span,
.catalogSearchResult .catalog-item.blueprint .catalog-type span,.catalogSearchResult .catalog-item.deployed .catalog-type span{color:#333;}
.catalogSearchResult .catalog-item.blueprint .catalog-type span:before,.catalogSearchResult .catalog-item.deployed .catalog-type span:before{background-color: #7a13df;}
.catalog-top-search{    
  border-bottom:1px solid var(--border-borderbase);
}
.catalog-search-box.search-input{display: flex;max-width:700px;border:1px solid var(--border-borderbase);
  background: var(--background-bgcard); color:var(--content-contentsecondary);margin: 0 0.5rem 0.5rem!important;}
  .catalog-search-box.search-input-v2{display: flex;max-width:700px;border:1px solid var(--border-borderbase);
    background: var(--background-bgcard); color:var(--content-contentsecondary);margin: 0 0.5rem 0.5rem!important;}
  .catalog-search-box.search-input input{color:var(--content-contentsecondary);height:inherit!important}
  .catalog-search-box.search-input-v2 input{color:var(--content-contentsecondary);height:inherit!important}
 
.catalog-search-box #searchBtn{color:var(--content-contentsecondary)}
.cloud-provider-list{position: relative;
  display: flex;
  vertical-align: middle;
  flex-direction: row;
  flex-wrap: wrap;}
  .cloud-provider-list li{margin-bottom: 0.25rem;}
  .cloud-provider-list li:not(:last-child){margin-right: 0.5rem;}
.cloud-provider-list .btn{    text-align: left;
  padding:2px 1.25rem; min-width: auto;box-shadow: none !important;}
.cloud-provider-list .icon{background-color: var(--grey-02);padding:0.5rem;border-radius:var(--radius-circle);width:36px;height:36px;display: inline-block;margin-right:0.5rem ; line-height: 1;   color: var(--content-primary);
font-size: 1.25rem;}
  .cloud-provider-list .btn:hover{background-color: var(--background-primary);}
.cloud-provider-list.btn-group>.btn-check:checked+.btn .icon,
.cloud-provider-list.btn-group>.btn-check:focus+.btn .icon,
.cloud-provider-list.btn-group>.btn.active .icon,
.cloud-provider-list.btn-group>.btn:active .icon,
.cloud-provider-list.btn-group>.btn:focus .icon,
.cloud-provider-list.btn-group>.btn:hover .icon {background-color: var(--primary-hover);color:var(--background-light)} 
/* inner page cloud provider */
.cloud-provider2.selected{box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.15);border-color:var(--border-primary);z-index:1;border-top-width:1px ;    background: var(--hcl-blue10);}
.cloud-provider2{padding:1rem}
.cloud-provider2 p,.cloud-provider:hover{color: var(--content-contentsecondary)}
.cloud-provider2 h4{color: var(--content-contentbase);font-size: 1rem;}
.cloud-provider2 .status-icon{padding: 0.75rem;width:60px; height:60px;margin-right:1rem}
.cloud-provider2 .status-icon svg,.cloud-provider .status-icon > img{vertical-align: middle;margin: auto;width:36px}


.catalog-search .search-result{line-height: 39px;}
.catalogSearchResult .info-box{border: 1px solid var(--border-borderbase);margin-bottom: 2rem;border-radius: var(--radius-none).2rem;width:100%; position: relative;
  min-height: 282px;
    background: var(--steps_content_bg);
  background-color: var(--background-light);
  box-shadow:2px 1px 4px #0001;
}

.selectCloud .catalogSearchResult .info-box{min-height: 180px;}

.catalogSearchResult .info-box-text{text-transform:none;display: block;position: relative;}
.catalog-item .info-box-text-heading{font-size: 1.35em;color:var(--content-contentbase);
  margin: 0;
  
  line-height: 1.5;
  padding-bottom: 0rem;font-weight:400}
  .catalog-item .seperator{margin:0.5rem 0;border-bottom: 1px solid var(--border-borderbase);}
  .catalogSearchResult .info-box .info-box-content{padding:1rem}
.catalog-item .info-box-text .description{white-space:normal;overflow: auto;line-height: normal;}
.catalog-item .options{display:none;position: absolute;bottom:0;left:0;right:0;top:0; padding:0rem;border-radius: var(--radius-none).2rem; z-index:9;background: var(--background-bgcard);
  animation: fadeIn  .75s ease-in-out}
.catalogSearchResult .info-box:hover .options{display: inline;}
.options .info-box-text-heading{margin-bottom:0}
.catalog-type{display: block;text-align: right;}
.catalog-item .catalog-icon {
  width: 60px;
  height: 60px;

} 
.catalog-item .catalog-icon+div{width: calc(100% - 60px);}

.catalog-item .info-tags{    border-top: 0px solid #d1d6da;
  margin-top: 1rem;
  padding: 1rem;
  text-align: left;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.catalog-item .options .info-tags{margin-top:0;padding-top:0}
  
  .summary-table td{white-space: normal;}
  .summary-value {
    font-weight: 500;
    color: var(--content-contentbase);
}

.catalog-details-heading{padding: 0.75rem 0;
  border-bottom: 1px solid var(--border-borderbase);
  margin-bottom: 1rem;
  font-size: 1.2em;
color:var(--content-contentbase)}
  .catalog-details-heading .catalog-name{color:var(--content-primary);font-weight: 500;}
  .catalog-details-heading-level2{font-size: 0.8rem;color:var(--content-contentbase);padding: 0.25rem 0;
    border-bottom: 1px solid var(--border-borderbase);
    margin-bottom: 1rem;}
  @media(min-width: 1024px){
  .modal-content .button-section .btn{min-width: 250px}
  }
  @media(max-width: 1200px){.modal-content .button-section .btn{margin-bottom: 0.5rem;}}
 
  .web-configuration-list .btn,
  .db-configuration-list .btn,
  .app-configuration-list .badge{margin-right:0.5rem;margin-bottom: 0.5rem;}
  .request-section{height:100%}
  .request-steps{display: flex;flex-direction: column;line-height: 14px;}
  .step-content{ padding: 1rem;
    height: 100%;
    overflow: hidden;}
.step-content-section {
    overflow: hidden;
    overflow-y: auto;height:calc(100% - 129px);
    padding: 0 10px;
}
#approvalTemplateCreationModal .step-content-section{
  height:100%
}
#emailTemplateModal .step-content-section{height:calc(100% - 79px)}
.resources-content-section{overflow: hidden;
  overflow-y: auto;height:calc(100% - 139px)}
.resources-content-section.withoutfooter,.step-content-section.withoutfooter{height:calc(100% - 63px)}

#resquestList tr.completed-state td:first-child{border-left:4px solid var(--border-positive)}
#resquestList tr.error-state td:first-child{border-left:4px solid var(--border-negative)}
#resquestList tr.inprogress-state td:first-child{border-left:4px solid var(--border-notice)}

.deployment-progress{height:5px;margin-top: 12px;}
.metric-cards .card:hover{box-shadow: -1px 1px 6px 2px rgba(0, 0, 0, 0.10);z-index: 1;}

.configurationAccordion .accordion-item{border:1px solid  var(--border-borderbase2);border-bottom:2px solid;border-radius: var(--radius-none);}
.configurationAccordion .accordion-collapse.show{border-top:1px solid rgb(0 0 0 / 13%) ;}
.configurationAccordion h2{font-size: var(--heading-6);margin: 0;}
.configurationAccordion h2>span{display: block;font-size: var(--regular);font-weight: 400;}
.configurationAccordion .accordion-button{width:auto;padding:0.5rem 0.75rem;border-radius: var(--radius-none);    background: var(--background-base);color: var(--family-inter);}
.configurationAccordion .accordion-button:not(.collapsed){
  box-shadow: none;
  border-bottom: 2px solid var(--border-primary)}
.configurationAccordion .accordion-item.active {
  border-bottom-color: var(--border-primary);
}
.configurationAccordion .accordion-item.filled .accordion-header {
  border-left: 2px solid var(--background-positive);
}
#overviewSection, .overviewSection{background-color: var(--background-light);border-bottom: 1px solid var(--border-borderbase);}
#overviewSection .section-heading{font-size:1.3em;    margin: 0;
  line-height: inherit;}
  .overview-metrics{display: flex;flex-wrap: wrap;}
.overview-metrics a{font-size: 1em;color:var(--content-contentsecondary)}
.overview-metrics li:not(:first-child),.resource-metrics li:not(:first-child){border-left:1px solid var(--border-borderbase);}
.overview-metrics li a{padding:0 1rem; display: flex;flex-direction: row-reverse; align-items: center;flex-wrap: wrap;}
.overview-metrics a span{color:var(--content-contentbase);margin-left:1rem;font-weight: bold;font-size: 1.3em;}
.resource-metrics{flex-direction: row;flex-wrap: wrap;}
.resource-metrics li{padding:0 1rem;display: flex;flex-direction: column;justify-content: flex-start;text-align: left;font-size: 0.8rem;}
.resource-metrics.firstChildPadding-none li:first-child{padding-left: 0;}

.resource-metrics li span{font-size: 0.9rem;line-height: 1.2;font-weight: bold;}
@media(max-width:768px){

.overview-metrics li a{text-align:center;flex-direction: column;}
.overview-metrics a span,.resource-metrics li span{margin:0}
.cs-options{width:100%}
}
.cs-options>div{flex-wrap: wrap;}
@media(max-width:640px){.overview-metrics{flex-direction:column}
.overview-metrics li:not(:first-child){border-left:0;border-top:1px solid var(--border-borderbase);margin-top:0}
.overview-metrics li a,.overview-metrics li{padding:0.5rem 1rem;}
.resource-metrics li{margin-bottom: 0.5rem;}}
#cartDropdown p{margin-bottom: 0;}
#cartDropdown a {color:var(--content-contentsecondary)}
#cartDropdown .dropdown-item:hover a,#cartDropdown .dropdown-item:hover a h4,#cartDropdown .dropdown-item a:hover{color: #fff!important;}
#cartDropdown li{border-bottom: 1px solid var(--border-borderbase);}
.img-thumbnail{border-color:var(--border-borderbase2)}
.resources-details-charts{width:100px; height:50px;margin-bottom: 0.5rem;}
.resources-details-charts svg{width: 100px!important;
  height: 50px!important;}

.detail-card{background-color: var(--background-bgcard);margin-bottom: 1rem;border:1px solid var(--border-borderbase)}
.detail-card:hover{background-color: var(--background-light);}
.detail-card .detail-name{font-size: 1rem; cursor: pointer;color:var(--content-contentbase)}
.detail-card .detail-id-status{ padding: 0rem 1rem; border-bottom: 1px solid var(--border-borderbase);display: flex;align-items: center;justify-content: flex-start;font-weight:500;line-height: 30px;}
.detail-card .resource-metrics{ padding: 0.5rem 1rem;}
.detail-card .resource-metrics li{width:25%; display: inline-block;border:0;padding:0px;line-height: 24px;}
.detail-card .resource-metrics li >span{margin-left:1rem}

@media (max-width:1024px){
  .detail-card .resource-metrics li{width:50%}
}
@media (max-width:660px){
  .detail-card .resource-metrics li{width:auto;margin-right:2.5rem}
}
.bg-statusNotStarted{background-color:#808080}
.bg-statuspendingApproval, .bg-statusMaximumTimeoutReached{background-color:#0000ff}
.bg-statusRejeected, .bg-statusFailed{background-color:var(--critical)}
.bg-statusInprogress{background-color:var(--warning)}
.bg-statusSuccess{background-color:var(--background-positive)}
.bg-statusreferback, .bg-statusPendingforReview{background-color:#801309}
.bg-statusITverficationPending{background-color:#800080}
.bg-statusInProgressAsync{background-color:#40e0d0; color:var(--content-contentbase)}
.bg-statusautoapproved, .bg-statusITVerificationPending{background-color:#ffff00; color:var(--content-contentbase)}

.progress{background-color: var(--grey-02);}
.dark-mode .progress{background-color: var(--border-borderbase2);}
.offcanvas{width:auto}
@media (min-width: 992px){
.offcanvas-lg, .offcanvas-xl {
    max-width: 800px;
}

#topnav-toggle{display: none !important;}


}
@media (min-width: 1200px){
.offcanvas-xl {
    max-width: 1140px;
}
}

.no-chart{height:97%}

/* Responsive border */
@media(max-width: 992px){.border-lg-0{border:0!important}}
@media(max-width: 768px){.border-xs-0{border:0!important}} 
/* -/Responsive border */
.component-list{position: relative;}
.view-all-compontents {
  background-color: var(--background-light);
  border-radius: var(--radius-none) 0 10px 10px;
  position: absolute;
  bottom: -41px;
  left: 50%;
  color: #434343;
  z-index: 1;
  padding: 0.5rem 1rem;
  border: 1px solid var(--border-borderbase);
  border-top: 0;
}
.accordion-header .myicons{font-size: 28px;}


.cloud-type-value {height:auto;background: #fff;
  border: 1px solid #f0f0f0;padding: 0.5rem 0.75rem; line-height: inherit;}
.cloud-type-value p{
     font-size: 12px;margin:0}
.cloud-type-value.active{border-bottom:2px solid var(--border-primary);}
.singleBoxCloudType{
  border: 1px solid var(--border-borderbase);
  -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  border-radius: 6px;position: relative;
  background: var(--steps_content_bg);
}
.cloudTypeWithBorder{position: relative;}
.cloudTypeWithBorder:after{content: "";position: absolute;width: 2px; background: var(--border-borderbase);height: 70%;top: 0;bottom: 0;margin: auto;right: 0;}
.singleBoxCloudType.cloud-type .cloud-type-value{background: transparent;border-radius: var(--radius-none);}
.cloud-type .cloud-type-value {height:auto;color:#7d7c7c;background: #fff;border: 1px solid #f0f0f0;border-bottom:4px solid transparent;padding: 1rem 0.75rem; line-height: inherit;}
.cloud-type .cloud-type-value p{font-size: 1rem;}
.cloud-type label{font-size: 18px;
  margin-bottom: 10px;color:var(--content-contentsecondary)}
.cloud-type .cloud-type-value .form-check{margin:0 1rem 0 0.5rem;right:0}
.cloud-type .form-check-input{width: 1.5rem;height:1.5rem;}
.cloud-type .cloud-type-value.active{border-bottom: 4px solid var(--border-primary);}

.cloud-type-points{padding:1rem 1rem 0}
.cloud-type-points li{margin-bottom: 10px;list-style: square;list-style-position: outside;}
#cloud_setup_configuration .card-header,
 /* #cloud_setup_configuration .step-content, */
 #StepPreviewButtonSection{border: 1px solid var(--border-borderbase)}
#StepPreviewButtonSection{border-top:0}
#cloud_setup_configuration .step-content{padding-bottom:0}
#cloud_setup_configuration .step-content > .row{margin:0 -16px}
.bi {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  fill: currentcolor;
}
#liveAlert{z-index:3}
.active-user{width:2.5em!important;height:1.5em}

#ApprovalTemplate_listbox li:last-child{color:var(--content-primary);background-color: var(--background-light);}
#controlTabs .last-child .nav-link:hover,#controlTabs .last-child .nav-link:active,#controlTabs .last-child .nav-link:focus{border-color:transparent}
.itempanel {
  border: 0px solid var(--border-borderbase);
  max-width: 100%;
}
#itemlist .k-listview{border:0 solid transparent!important}
#itemlist .delete_item,#itemlist .edit_item{display: none;}
.list-item{flex: 0 0 auto;
  width: 100%;}
#newlist {display: flex;
  justify-content:start;flex-direction:row; flex-wrap: wrap; align-items:start;align-content: flex-start;
  height:600px}
#newlist.cc3 .column{padding:0 12px;
  width: 33.33333333%;}
  #newlist.cc2 .column{padding:0 12px;
  width: 50%;}
.itempanel .list-item{
  background-color: var(--background-light);
  border: 1px solid var(--border-borderbase);
  box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.10);margin-bottom:0.25rem; display: flex; justify-content: space-between; padding: 0.5rem 1rem;align-items: center;}
  #itemlist.itempanel .list-item{
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.10); background-color:var(--background-light)}
#newlist .move_item{display: none;}
#itemlist .list-item .btn{cursor:move}
#testAll{height:auto!important}

#catalogCreationContent .tab-pane{min-height:400px;height:100%}
#controlTabsContent .tab-pane
/* .control-sortable-panel */
    .control-sortable-panel .list-item{
      min-height: 54px;
      margin-top:0.75rem;margin-bottom:0.75rem;
      background-color: var(--background-light);
      border: 1px solid var(--border-borderbase);
      border-left-width:4px;
      box-shadow:  0 2px 6px 0 rgba(0, 0, 0, 0.10); display: flex; justify-content: space-between; padding: 0.5rem 1rem;align-items: center;}

      #sortable-controls {
        padding: 0;
        margin: 0;
        height:100%
    }

    .control-sortable-panel .sortable {
        list-style-type: none;
        padding: 6px 8px;
        margin: 0;
        color: #666;
        cursor: move;
        border: 1px dashed var(--border-borderbase);
margin-left: -1px;
margin-bottom: -1px;
    }
    .control-sortable-panel .sortable:hover {
background-color: var(--hcl-blue10);
}
.control-sortable-panel .sortable.last-child{
        cursor: pointer;background-color: var(--hcl-blue10);
    }
    .control-sortable-panel .sortable.last-child .list-item{box-shadow: none;border:none;background: none;padding:0}
    .sortable.hint .list-item {
        display: block;
        max-width: 33%;
        background-color: var(--hcl-techblue05);
        color: #fff;padding:1rem;
        position: relative;border-radius:4px;
    }
   .sortable.hint .list-item:after {
        content: "";
        display: block;
        width: 0;
        height: 0;
        border-top: 6px solid transparent;
        border-bottom: 6px solid transparent;
        border-left: 6px solid var(--hcl-techblue05);
        position: absolute;
        right: -6px;
        top: 8px;
    }

    .control-sortable-panel .sortable.hint:last-child {
        border-radius: 4px;
    }

    .sortable.hint span {
        color: #fff;
    }
    .sortable.hint .list-item div:last-child{display: none;}
    .control-sortable-panel .placeholder {
        background-color: var(--hcl-blue09);
        color: var(--text-primary);
        text-align: right;
    }    

.control-sortable-panel .list-item.TextBox-box{border-left-color:#ff9f00}
 .legends .legends.TextBox-box{background-color:#ff9f00}
.control-sortable-panel .list-item.TextArea-box{border-left-color:#800080}
 .legends .legends.TextArea-box{background-color:#800080}
.control-sortable-panel .list-item.Select-box{border-left-color:#67ce07} 
.legends .legends.Select-box{background-color:#67ce07}
.control-sortable-panel .list-item.Date-box{border-left-color:#801309}
.legends .legends.Date-box{background-color:#801309}
.control-sortable-panel .list-item.HiddenField-box{border-left-color:#d614b2}
.legends .legends.HiddenField-box{background-color:#d614b2}
.control-sortable-panel .list-item.KeyValuePair-box{border-left-color:#7a13df}
.legends .legends.KeyValuePair-box{background-color:#7a13df}
.control-sortable-panel .list-item.Add-Storage-box{border-left-color:#13afdf}
.legends .legends.Add-Storage-box{background-color:#13afdf}
.control-sortable-panel .list-item.Button-box{border-left-color:#0a73a8} 
.legends .legends.Button-box{background-color:#0a73a8}
.control-sortable-panel .list-item.CustomControl-box{border-left-color:#ef5a0f}
.legends .legends.CustomControl-box{background-color:#ef5a0f}


.tableHeaderNone .k-grid-toolbar.k-toolbar{display: none;}
.ouConfigurationDetails:first-child:last-child .deleteConfigurationDetails{display: none;}
.AllOuConfiguration .ouConfigurationDetails label{display: none;}
.AllOuConfiguration .ouConfigurationDetails:first-child label, .AllOuConfiguration .ouConfigurationDetails:first-child:last-child label{display: block;}
.ouConfigurationDetails .addOuConfiguration{display: none;}
.ouConfigurationDetails:last-child .addOuConfiguration{display: inline-block;}
.ouConfigurationDetails:first-child .answerMargin{ margin-top: 12px;}
.ouConfigurationDetails .answerMargin{ margin-top: 5px;}
.AllOuConfiguration{padding: 1rem;  border: 1px solid var(--border-borderbase); border-top: 0;}
.catalog-item.configuration-item a {animation: fadeIn  .75s ease-in-out; color:var(--content-contentsecondary)}
.catalog-item.configuration-item .info-box{max-height: 170px;
min-height: 170px;}
.catalog-item.configuration-item .catalog-icon .myicons{font-size: 50px;}
.catalog-item.configuration-item:hover a{color:var(--content-contentsecondary)!important;}
.catalog-item.configuration-item:hover{box-shadow:1px -6px 8px 0px rgba(0, 0, 0, 0.10); color:var(--content-contentsecondary)!important}
.catalog-item.configuration-item:hover a .info-box{background-color: var(--background-bgcard);}
@media(min-width:768px){.btn.form-go{margin-top:1.75rem}}


/*Start Ritesh CSS*/
.addAnswersForm:first-child:last-child .deleteAnswersForm{display: none;}
.allAnswerForm .addAnswersForm label{display: none;}
.allAnswerForm .addAnswersForm:first-child label, .allAnswerForm .addAnswersForm:first-child:last-child label{display: block;}
.addAnswersForm .cloneAnswersForm{display: none;}
.addAnswersForm:last-child .cloneAnswersForm{display: inline-block;}
.addAnswersForm:first-child .answerMargin{ margin-top: 12px;}
.addAnswersForm .answerMargin{ margin-top: 5px;}
.afterNone:after{display: none;}
.greyBackgroundColor{background-color: #c2c4c5;}
.whiteColor {color: var(--bs-white);}
#filtersField .delete-filter-row{display: none;}
.readMore{display: inline;}
.fontSize13{font-size: 0.8rem;}
.fontSize16{font-size: 16px;}
.fontSize20{font-size: 20px;}
.fontSize22{font-size: 22px !important;}
.preCode pre{background: #f9f9f9; padding: 16px;}
.termsConditions{font-size: 12px;font-style: italic;}
.whiteBackground{background: var(--bs-white);}
.borderRadius0{border-radius: var(--radius-none);}
.innerCloneForm:first-child:last-child .deleteAnswersForm{display: none;}
.cloneForms .innerCloneForm:not(.withLabel) label{display: none;}
.cloneForms .innerCloneForm:first-child label, .cloneForms .innerCloneForm:first-child:last-child label{display: block;}
.innerCloneForm .cloneAnswersForm{display: none;}
.innerCloneForm .deleteAnswersForm{display: inline-block;}
.innerCloneForm:last-child .cloneAnswersForm{display: inline-block;}
.innerCloneForm.first-child .deleteAnswersForm{display: inline-block;}
.cloneTitle{font-size: 0.9rem;}
#listBoxItems .demo-section {max-width: none; width: 665px; }
#listBoxItems .k-listbox {width: 285px;height: 350px;}
#listBoxItems .k-listbox:first-of-type { margin-right: 1px; }
.customPopup {position: fixed;left: 0;right: 0;bottom: 0;top: 0;width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;z-index: 9;background: rgba(0,0,0,0.6);}
.customPopup p{color: var(--bs-white);}
.overflow_hidden{overflow: hidden !important;}
#chart-container {position: relative;height: 100vh; overflow: hidden;}
.overview-metrics li:last-child a{padding-right: 0;}
.graphHeight{height: 350px !important;}
.greyBackgroundBorder{    background: var(--background-light);    border-bottom: 1px solid var(--border-borderbase);}
.positionBottom {width: 100%;left: 0;right: 0;padding: 0 16px;bottom: 10px;}
.paddingBottom40{padding-bottom: 40px;}
.showBreakupDetail{    position: absolute;right: 0;left: 0;bottom: -14px;margin: auto;text-align: center;background: var(--background-light);display: inline-table;z-index: 9;padding: 4px 10px;border-radius: 4px;}
/* Errors pages Start */

.error_cont{width: 100%; height: calc(100vh - 94px); display: flex; justify-content: left; align-items: center; background-image: url("/assets/404-bg-k7VXzTly.jpg");  background-color: #fff; background-size:cover; background-repeat: no-repeat; background-position: right;} 
.err_svg{width: 350px; height: 350px; background: #f5f4f9; display: flex; justify-content: center; border-radius: 50%;}
.err_svg span{align-items: center; display: flex; }
.seticon{fill: #181926; width: 150px; height: 150px;}

.err_text {position: relative; margin-top: 36px; text-align: center; margin-left: 10%;}
.err_text h2{font-size: 100px;  color: #27447e; margin: 0;}
.err_text h3{font-size: 33px;  color: #181926; font-weight: bold;}
.err_text p{color:#8d9193; font-size: 17px;}
.err_text a {
  font-size: 18px;
  color: var(--bs-white);
  font-weight: bold;
  background: #27447e;
  padding: 7px 21px;
  border-radius: 30px;
  margin-top: 10px;
  display: inline-block;
  transition:0.5s all ease-in-out;
  -webkit-transition:0.5s all ease-in-out;
  -moz-transition:0.5s all ease-in-out;
  border: 1px solid transparent;
}

.err_text a:hover {
  background: var(--bs-white);
  border: 1px solid #27447e;
}

/* Chart Starts */
.iframeHeight450 {
  overflow: hidden;
  height: 450px;
  width: 100%;
}
.iframeHeight320 {
  overflow: hidden;
  height: 320px;
  width: 100%;
}
.dashboard-cards {padding: 1rem 0;}
.dashboard-cards .card{
  -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  background: var(--steps_content_bg);
}
/* Chart Ends */

@media (max-device-width: 991px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) { 
  .err_text {margin-left: 5%;}
  .error_cont{width: 100%; background: var(--bs-white);  height: 100vh; display: flex; justify-content: left; align-items: center;
    background-image: url("/assets/404-bg-k7VXzTly.jpg");
    background-color: #cccccc; background-size: cover; background-repeat: no-repeat;
  } 
.err_text p {font-size: 13px;}
.err_text h2 {font-size: 60px;}
.err_text h3 {font-size: 26px;}
}



@media (max-device-width: 991px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) { 
  .err_text {margin: 31% auto auto;}
  .error_cont{width: 100%; background: #fff;  height: 100vh; display: flex; justify-content: left; align-items: baseline;
    background-image: url("/assets/404-bg2-8nerTsYt.jpg");
    background-color: #cccccc; background-size: cover; background-repeat: no-repeat;
  } 
.err_text p {font-size: 13px;}
.err_text h2 {font-size: 60px;}
.err_text h3 {font-size: 26px;}
}

/* Errors pages END */

.borderLeft-1{border-left: 1px solid var(--border-borderbase) !important;}
.borderbottom-1{border-bottom: 1px solid var(--border-borderbase) !important;}

.maximizeControl{
  position: absolute;
  right: 16px;
  top: 10px;
  cursor: pointer;
  padding: 4px;
  border: 1px solid var(--border-borderbase);
  border-radius: var(--radius-none).25rem;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.headingWithLine{margin-top: 16px;color: var(--content-contentbase);font-size: 1.7em;font-weight:400}
.headingWithLine span{background-color: var(--background-base);position: relative;padding: 0 12px;}
.headingWithLine:before{content: "";position: absolute;width: 100%;height: 1px;left: 0;right: 0;top: 0;bottom: 0;background: var(--headingTextColor);margin: auto;}
.readmoreContent span{height: 32px;overflow: hidden;}
.readmoreContent a{font-size: 0.8rem;cursor: pointer;}

.cloud-type-value svg{fill: var(--content-contentsecondary);}

/* Start Badge version 2 css */
.badgeVersion2 {
  display: inline-block;
  font-size: .80em;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: var(--radius-none).25rem;
  border: 1px solid var(--border-borderbase);
  color: var(--content-contentsecondary) !important;
  padding: 8px 16px 8px 38px;
  position: relative;
  background: var(--background-bgcard);
}

.badgeVersion2:before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  left: 8px;
  top: 0;
  bottom: 0;
  margin: auto;
  border-radius: 50%;
}

.badgeVersion2.bg-success, .badgeVersion2.bg-danger {background: var(--background-bgcard) !important;}

.badgeVersion2.bg-success:before {
  background: var(--background-positive) !important;
}

.badgeVersion2.bg-danger:before {
  background: var(--background-negative) !important;
}

.badgeVersion2:after {
  content: "";
  position: absolute;
  left: 28px;
  top: 0;
  bottom: 0;
  margin: auto;
  width: 1px;
  height: 60%;
  background: var(--border-borderbase);
}

/* End Badge version 2 css */

@media screen and (max-width:1600px){

  .headingWithLine{
    margin-top: 10px;
  }
}


@media screen and (max-width:1400px){
  .headingWithLine{
    font-size: 1.6em;
    margin-top: 6px;
  }
 
  .dayOneSteps{
    margin-top: 1em;
  }
  
}

@media screen and (max-width:1200px){
  .dayOneSteps{
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .reportDT h2 {
    font-size: var(--size-xl);
  }
  .card-container-nodes {
    height: 100px !important;
  }
}


@media screen and (max-width:767px){
 
  .nav-tabs.horizontal-tabs {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
}

}

textarea.input-box{height: 56px;}

@media screen and (max-width:620px){
  .headingWithLine span {
   
    width: 90%;
    display: block;
    margin: 0 auto;
  }
  }
  @media screen and (max-width:576px){
    .cloudTypeWithBorder:after{
      width: 100%;
      top: initial;
      height: 2px;
      bottom: 0;
    }
  }

  


  .form-switch .form-check-input{width: 2.5em;}
  
  .form-switch .form-check-input:checked {
    background-position: right center;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

.form-control-sm{padding: 0.25rem 0.5rem !important;}
  body .tableNoColor .k-grid, body .tableNoColor .k-grid th, body .tableNoColor .k-grid tr, body .tableNoColor .k-grid td, body .tableNoColor .k-grid .k-grid-header, body .tableNoColor .k-grid .k-table-thead, body .tableNoColor .k-grid *:hover{background: none !important;}
  body .tableNoColor .k-grid .k-grid-content.k-auto-scrollable{overflow: hidden;}
  .custom-boxshadow{
    box-shadow: 2px 1px 4px #0001;
     transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; 
  }

  .tableReadMore {position: relative;}
  .tableReadMore .tableReadMoreLink{position: absolute;bottom: -12px;left: 0;right: 0;background: var(--background-light); max-width: 100px;width: 100%;margin: auto;padding: 4px;text-align: center;border-radius:4px;font-size: 0.8rem;}
  .catalogWithAnimation > .row > div{flex: 1; max-width: 33.33%;min-width: 330px;}
  .catalogWithAnimation .info-box{position: relative;cursor: pointer;transition: 0.3s all ease-in-out;}
  .catalogWithAnimation .info-box:hover{box-shadow: 2px 1px 8px #0003; }
  .catalogWithAnimation .info-box.active{box-shadow: 2px 1px 8px #0003;border-bottom:3px solid var(--background-positive); }
  
  .requestListView{overflow: hidden;position: relative;}
  .requestListView .requestDetailsClose{position: absolute;top: 4px;right: 4px;margin: auto;cursor: pointer;}
  .requestListView .requestDetailsClose span{font-size: 24px;}
  .requestListView > #requestList{width: 100%;transition: 0.5s all ease-in-out;}
  .requestListView.requestActive > #requestList{width: 30%;}
  .requestListView #requestDetailsBlock{transition: 0.5s all ease-in-out;width: 0;flex: initial;height: 0;position: absolute;top: 0;right: -100px;}
  .requestListView.requestActive #requestDetailsBlock{width: 70%;right: 0;overflow-y: auto;height: 100%;overflow-x: hidden;box-shadow: rgba(0, 0, 0, 0.2) 0px 8px 10px -2px;}
  .tableRowActive, .tableRowActive td{background: var(--hcl-blue10);}
.documentDetailsListing > ul > li > p {max-width: 260px;width: 100%;padding: 0;margin: 0;}
.documentDetailsListing > ul > li > ul{display: flex;height: 100%;align-items: center;}
.documentDetailsListing > ul  > li{padding: 10px 0;display: flex;align-items: center;border-bottom: 1px solid var(--border-borderbase);justify-content: space-between;}
 .documentDetailsListing > ul 
 > li > ul > li > span{margin: 0 12px;cursor: pointer;}

 #customAdvanceFilterIcon{background-color: var(--background-light);  border-bottom: 1px solid var(--border-borderbase);}
 .customfiltersSection .form-control{padding: 7.2px 14px;}
 .customFilters .form-check{padding-left: 48px;}
 .customFilters .form-check label{color: var(--content-contentsecondary);font-size: 14px;}

 #scripts .card{width: 33.33%;flex-grow: 1;}
 #scripts .card-body textarea{background: #222e3c;color: var(--white);border-radius: var(--radius-none);height: 100%;}
 #scripts .card .card-header{background: var(--background-light);}
 #scripts .card .card-header .information-circle{ margin-top: 3px; margin-left: 2px;cursor: pointer;}
 .bannerImagePreview img {
  max-width: 100%;
  height: 100px;
  object-fit: cover;
  border: 1px solid var(--border-borderbase);
}


/* base components into material */
.fade{transition: opacity .5s linear;}
/* buttons */
.btn-icon{width:36px;
  height: 36px;
  line-height: 1;}
  .btn{display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    position: relative;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    background-color: transparent;
    outline: 0px;
   
    margin: 0px;
    cursor: pointer;
    user-select: none;
    vertical-align: middle;
    appearance: none;
    text-decoration: none;
    font-family: var(--family-inter);
    font-weight:var(--heading-m-semibold-weight);
    font-weight: 500;
    font-size: var(--size-l);
    line-height: 1.75;
    letter-spacing: 0.02857em;
    border-radius: var(--radius-m);
    border: var(--width-xs) solid ;
   
padding: var(--space-s) var(--space-xl);
gap: var(--space-s);
    transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  }

.btn.btn-sm{min-width: auto !important;padding:4px 10px}


.btn.btn-link, .k-dialog-actions .btn.btn-link{padding: 6px 8px;color: var(--button-buttonlink);box-shadow: none;background-color: var(--background-transparent);border-color:var(--border-bordertransparent)}
.btn.btn-link:hover, .k-dialog-actions .btn.btn-link:hover,
.btn.btn-link.active, .k-dialog-actions .btn.btn-link.active,
.btn.btn-link:active, .k-dialog-actions .btn.btn-link:active{color:var(--button-buttonprimary);}


.btn.btn-outline-secondary{background-color: transparent;color:var(--secondary);border:1px solid var(--secondary);box-shadow:none}
.btn.btn-outline-secondary:hover{background-color: var(--secondary);color:var(--white);border:1px solid var(--secondary);box-shadow:none}

.btn.disabled{
    color: rgba(0, 0, 0, 0.26);
    box-shadow: none;
    background-color: rgba(0, 0, 0, 0.12);
  }
.btn.btn-link.disabled {
  color: rgba(0, 0, 0, 0.26);
}
.btn.btn-outline-primary.disabled,.btn.btn-outline-secondary.disabled{
  color: rgba(0, 0, 0, 0.26);
  border: 1px solid rgba(0, 0, 0, 0.12);
}
  
  .btn.btn-md{padding:6px 16px}
  .btn.btn-lg{padding:8px 22px}
  .btn.btn-link.btn-sm{padding:4px 5px}
  .btn.btn-link.btn-md{padding:6px 8px}
  .btn.btn-link.btn-lg{padding:8px 11px}
  .btn.btn-outline.btn-sm{padding:3px 9px}
  .btn.btn-outline.btn-md{padding:5px 15px}
  .btn.btn-outline.btn-lg{padding:7px 21px}
.btn.btn-icon{padding:8px;color:var(--content-contentsecondary); border-radius: var(--radius-circle); border:0}
.btn.btn-icon.btn-sm{    padding: 5px;
  line-height: inherit;
 
 }

.btn.btn-icon.btn-lg{padding:12px}
.btn.btn-icon.btn-lg svg,.btn.btn-icon.btn-lg .myicons{width:1.2rem;height:1.2rem}

 .btn-group{display: inline-flex;
  border-radius: 4px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 3px 1px -2px, rgba(0, 0, 0, 0.14) 0px 2px 2px 0px, rgba(0, 0, 0, 0.12) 0px 1px 5px 0px;}
  .btn-group:not(div){box-shadow: none;}
  .btn-group .btn{
    box-shadow: none;}
   
    .btn-group .btn:last-child{border-top-left-radius: 0px;
      border-bottom-left-radius: 0px;}

.btn.btn-primary{
  border-color:var(--button-buttonborder);
  color:var(--button-buttoncolor);
  background: var(--button-button);}

.btn-primary:hover,
.btn-check:focus+.btn-primary,
.btn-primary:focus,
.btn-check:active+.btn-primary,
.btn-check:checked+.btn-primary,
.btn-primary.active,
.btn-primary:active,
.show>.btn-primary.dropdown-toggle {
  border-color:var(--button-buttonborder)!important;
  color:var(--button-buttoncolor)!important;
  background: var(--button-button)!important}


.btn-outline-primary, .daterangepicker .drp-buttons .cancelBtn {
  color: var(--button-button) !important;
  border-color: var(--button-buttonborder);
  background: var(--background-transparent);}

.btn-outline-primary:hover, .daterangepicker .drp-buttons .cancelBtn:hover {
  border-color:var(--button-buttonborder)!important;
  color:var(--button-buttoncolor)!important;
  background: var(--button-button)!important;
}

  /* buttons end */
  .alert{
  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  border-radius: 4px;
  box-shadow: none;
  font-family: Roboto, Helvetica, Arial, sans-serif;
  font-size: 0.875rem;
  line-height: 1.43;
  letter-spacing: 0.01071em;
  background-color: rgb(237, 247, 237);
  display: flex;
  padding: 6px 16px;
  }
 /* base components into material end */


 /* Start Calender override CSS */
 .daterangepicker, .daterangepicker .calendar-table{border: 0;}
 .daterangepicker{    transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  border-radius: var(--radius-l);
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.08);
  outline: 0px;
  transform-origin: center bottom;z-index: 10005;

}
.daterangepicker .drp-calendar.left {
  padding: var(--space-m) var(--space-s) ;
}
.daterangepicker .drp-calendar.right {
  padding: var(--space-m) var(--space-s) ;
}

.daterangepicker .calendar-table th, .daterangepicker .calendar-table td{
  width: 34px;
  height: 34px;
  border-radius: 40px;
  border: 0;
  font-size: 14px;
  font-weight: 500;
  color:var(--content-contentsecondary)
}
.daterangepicker .calendar-table td.available{color:var(--content-contenttertiary)}
.daterangepicker th.prev.available:hover span, .daterangepicker th.next.available:hover span{border-color: var(--white);}

 .tooltip-inner{background: var(--background-inverse);color:var(--content-contentprimaryinverse)}
 .bs-tooltip-top .tooltip-arrow:before{border-top-color:var(--background-inverse)!important;}
 .bs-tooltip-bottom .tooltip-arrow:before{border-bottom-color:var(--background-inverse)!important;}
 .bs-tooltip-start .tooltip-arrow::before{border-left-color: var(--background-inverse) !important;}
 .bs-tooltip-end .tooltip-arrow::before{border-right-color: var(--background-inverse) !important;}

 /* Calender */
.daterangepicker, .daterangepicker select.hourselect, .daterangepicker select.minuteselect, .daterangepicker select.secondselect, .daterangepicker select.ampmselect {
  background-color: var(--background-bgbase);
  border: 1px solid var(--border-borderbase);
  color: var(--content-contentsecondary);
}

.daterangepicker:after {
  border-bottom-color: var(--background-bgbase);
}

.daterangepicker:before {
  border-bottom-color: var(--border-borderbase)
}

.daterangepicker .calendar-table {
  background-color: var(--background-bgbase);
  border-color: var(--border-borderbase)
}
.daterangepicker td.in-range{background-color:var(--nav-icon-hover);}
.daterangepicker td.start-date.end-date{border-radius:var(--radius-circle)}
.daterangepicker .ranges li.active,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker td.available:hover,
.daterangepicker th.available:hover,
.daterangepicker .ranges li:hover {
  background-color: var(--background-primary);
  color:var(--content-contentbase)!important;
}

.daterangepicker.show-ranges .drp-calendar.left {
  border-left-color: var(--border-borderbase)
}

.daterangepicker .drp-buttons {
  border-top-color: var(--border-borderbase)
}

.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
  background-color: var(--background-transparent);
  
  opacity: 0.3;
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
  border-color: var(--content-contentsecondary)
}
.dateRange label {position: absolute;left: 14px;top: 11px;overflow: initial;}
.dateRange {padding-top: 20px;position: relative;}
.dateRange label:before {position: absolute;content: "";width: 105%;height: 3px;background: #fff;top: 0px;bottom: 0;margin: auto;z-index: -1;left: -1px;}
.dateRange .input-group{height: 50px;border-radius:var(--radius-pill)}
.dateRange .input-group .form-control{height:100%; border-color: var(--border-bordercustom);border-right:0; border-radius:var(--radius-pill) 0 0 var(--radius-pill)}
.dateRange .input-group  .input-group-text {
  background-color: var(--background-formfield);
  border: 1px solid var(--border-bordercustom);
  color: var(--content-contentsecondary);border-radius:var(--radius-pill); font-size: 1.5em;
}
.dateRange .input-group>.form-control:focus, .dateRange .input-group>.form-select:focus{z-index: initial;border: 1px solid var(--primary);}
 /* end Calender override CSS */


 #tabList{height: 350px;overflow: auto;}

 .pointerEvents_initial{pointer-events: initial;}

 .cursor-pointer{cursor: pointer;}
 .information-circle:before {font-size: 21px;}

 

 @media screen and (min-width: 1640px) {
  .steps_icon{margin-top: 60px;}
}


/* Start Drag and Drop Functionality CSS */

/* --------------------------------------- */
.leftFlowDragable{width: 100%;}
.leftFlowDragable.full-width{width: 100%;}
.customCanvasWrapper{display: flex;justify-content: space-between;width: 100%;height: 530px;}
.workflowCode{display: none;}
.custom-canvas, .workflowCode{transition: 0.4s all;}
.customCanvasWrapper.toggleCode .custom-canvas{width:70%}
.customCanvasWrapper.toggleCode .workflowCode{
  width: 30%;
  display: block;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
}
.customCanvasWrapper #processTemplateTabsContent{height: calc(100% - 48px);}

.navbar-form .form-group {
  display: inline-block;
  margin-bottom: 0;
  vertical-align: middle;
}
.svg-icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  pointer-events: none;
}
.field-control .control-icon {
  float: left;
  margin-right: 8px;
  text-align: center;
  width: 24px;
  height: 24px;
}
.text-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generator:%20Adobe%20Illustrator%2019.0.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%206.00%20Build%200)%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cpath%20id='XMLID_10_'%20d='M15,4H4.5V3H6V2H4.5h-1H2v1h1.5v1H1C0.4,4,0,4.5,0,5v6c0,0.6,0.4,1,1,1h2.5v1H2v1h4v-1H4.5v-1H15%20c0.6,0,1-0.4,1-1V5C16,4.5,15.6,4,15,4z%20M1,11V5h2.5v6H1z%20M15,11H4.5V5H15V11z'/%3e%3c/svg%3e");}
.HideandShow{display: none;}
.dropped .HideandShow{display: block;position: relative;}
.dropped .customDragableBlock{display: none;}
.customDragableBlock{
  display: block;
  border: 1px solid var(--border-borderbase);
  padding: 8px 30px 8px 8px;
  color: var(--content-contentsecondary);
  background-color: var(--background-base);
  cursor: move;
}

.draggable .dateRange label{top: 14px;}

.customDragableBlock span{margin:0 2px;}
.customDragableBlock span:before{font-size: 24px;}
  .password-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generator:%20Adobe%20Illustrator%2027.2.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%206.00%20Build%200)%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cpath%20id='XMLID_10_'%20d='M15,4H4.5V3H6V2H4.5h-1H2v1h1.5v1H1C0.4,4,0,4.5,0,5v6c0,0.6,0.4,1,1,1h2.5v1H2v1h4v-1H4.5v-1H15%20c0.6,0,1-0.4,1-1V5C16,4.5,15.6,4,15,4z%20M1,11V5h2.5v6H1z%20M15,11H4.5V5H15V11z'/%3e%3cg%3e%3cpath%20d='M5.2,7.8L5.4,7l1.5,0.5l0-1.7h0.7l0,1.7L9,7.1l0.2,0.7L7.7,8.2l1,1.3L8,10L7.1,8.6L6.3,10L5.7,9.5l1-1.3L5.2,7.8z'/%3e%3cpath%20d='M9.5,7.8L9.7,7l1.5,0.5l0-1.7h0.7l0,1.7l1.5-0.5l0.2,0.7L12,8.2l1,1.3L12.4,10l-0.9-1.4L10.6,10L10,9.5l1-1.3L9.5,7.8z'/%3e%3c/g%3e%3c/svg%3e");}
  .select-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generator:%20Adobe%20Illustrator%2019.0.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%206.00%20Build%200)%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cpath%20id='XMLID_1_'%20d='M0,0v14h0c0,0.6,0.4,1,1,1h10c0.6,0,1-0.4,1-1h0V5h4V0H0z%20M1,1h10v3H1V1z%20M1,7h10v3H1V7z%20M1,14v-3h10v3H1z%20M15,4h-3V1h3V4z%20M2,2h1v1H2V2z%20M2,12h1v1H2V12z%20M4,12h1v1H4V12z%20M6,12h1v1H6V12z%20M9,12v1H8v-1H9z%20M2,8h1v1H2V8z%20M4,8h1v1H4V8z%20M6,8%20h1v1H6V8z%20M13.5,3.1l-1-1.1h1.9L13.5,3.1z%20M2,6V5h1v1H2L2,6z%20M4,6V5h1v1H4L4,6z'/%3e%3c/svg%3e");}
  .radio-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generator:%20Adobe%20Illustrator%2019.0.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%206.00%20Build%200)%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cpath%20d='M0,1h16V0H0V1z%20M0,3h16V2H0V3z%20M5,6h10V5H5V6z%20M15,9H5v1h10V9z%20M15,14v-1H5v1H15z%20M1.5,7C0.7,7,0,6.3,0,5.5S0.7,4,1.5,4%20S3,4.7,3,5.5S2.3,7,1.5,7z%20M1.5,5C1.2,5,1,5.2,1,5.5S1.2,6,1.5,6S2,5.8,2,5.5S1.8,5,1.5,5z%20M1.5,11.1C0.7,11.1,0,10.4,0,9.6%20s0.7-1.5,1.5-1.5S3,8.7,3,9.6S2.3,11.1,1.5,11.1z%20M1.5,9.1C1.2,9.1,1,9.3,1,9.6s0.2,0.5,0.5,0.5S2,9.8,2,9.6S1.8,9.1,1.5,9.1z%20M1.5,15C0.7,15,0,14.3,0,13.5S0.7,12,1.5,12S3,12.7,3,13.5S2.3,15,1.5,15z%20M1.5,13C1.2,13,1,13.2,1,13.5S1.2,14,1.5,14%20S2,13.8,2,13.5S1.8,13,1.5,13z'/%3e%3c/svg%3e");}
  .checkbox-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generator:%20Adobe%20Illustrator%2019.0.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%206.00%20Build%200)%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cpath%20d='M13.5,5v8c0,0.8-0.7,1.5-1.5,1.5H3c-0.8,0-1.5-0.7-1.5-1.5V4c0-0.8,0.7-1.5,1.5-1.5h9c0.7,0,1.3,0.5,1.5,1.2l2.4-1.4L13.5,5%20z%20M12.5,6.2L7.7,12L2.8,5.5l4.9,1.6l4.8-2.9V4c0-0.3-0.2-0.5-0.5-0.5H3C2.7,3.5,2.5,3.7,2.5,4v9c0,0.3,0.2,0.5,0.5,0.5h9%20c0.3,0,0.5-0.2,0.5-0.5V6.2z'/%3e%3c/svg%3e");}
  .textarea-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generator:%20Adobe%20Illustrator%2019.0.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%206.00%20Build%200)%20--%3e%3csvg%20version='1.1'%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cpath%20id='XMLID_1_'%20d='M3,11v-1h8v1H3L3,11z%20M3,7h10V6H3V7L3,7z%20M3,8v1h10V8H3L3,8z%20M13,4H3v1h10V4L13,4z%20M16,14V2c0-0.6-0.4-1-1-1%20H1C0.4,1,0,1.4,0,2v12c0,0.6,0.4,1,1,1h14C15.6,15,16,14.6,16,14z%20M15,2v12H1V2H15z'/%3e%3c/svg%3e");}
  .hidden-input{background-image:url(/assets/icon-hidden-juWO4Xol.svg);}
  .button-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'%20standalone='no'?%3e%3csvg%20xmlns:dc='http://purl.org/dc/elements/1.1/'%20xmlns:cc='http://creativecommons.org/ns%23'%20xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23'%20xmlns:svg='http://www.w3.org/2000/svg'%20xmlns='http://www.w3.org/2000/svg'%20version='1.1'%20id='Layer_1'%20x='0px'%20y='0px'%20viewBox='0%200%2016%2016'%20style='enable-background:new%200%200%2016%2016;'%20xml:space='preserve'%3e%3cmetadata%20id='metadata8'%3e%3crdf:RDF%3e%3ccc:Work%20rdf:about=''%3e%3cdc:format%3eimage/svg+xml%3c/dc:format%3e%3cdc:type%20rdf:resource='http://purl.org/dc/dcmitype/StillImage'%20/%3e%3cdc:title%3e%3c/dc:title%3e%3c/cc:Work%3e%3c/rdf:RDF%3e%3c/metadata%3e%3cdefs%20id='defs6'%20/%3e%3cpath%20id='rect4140'%20d='M%200.4765625,4%20A%200.47706934,0.47706934%200%200%200%200,4.4765625%20L%200,11.523438%20A%200.47706934,0.47706934%200%200%200%200.4765625,12%20L%2015.523438,12%20A%200.47706934,0.47706934%200%200%200%2016,11.523438%20L%2016,4.4765625%20A%200.47706934,0.47706934%200%200%200%2015.523438,4%20L%200.4765625,4%20Z%20m%200.4765625,0.953125%2014.09375,0%200,6.09375%20-14.09375,0%200,-6.09375%20z'%20style='color:%23000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:%23000000;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;baseline-shift:baseline;text-anchor:start;white-space:normal;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:%23000000;solid-opacity:1;fill:%23000000;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:0.95404327;stroke-linecap:butt;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:1.5;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate'%20/%3e%3cg%20id='layer1'%3e%3cg%20style='enable-background:new%200%200%2016%2016;font-style:normal;font-weight:normal;font-size:5px;line-height:125%25;font-family:Sans;letter-spacing:0px;word-spacing:0px;fill:%23000000;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1'%20id='text4203'%3e%3cg%20id='g4212'%20transform='translate(0.10112835,0.1001358)'%3e%3cpath%20style='fill:%23000000;fill-opacity:1'%20id='path4208'%20d='m%206.0690374,6.4093857%20q%20-0.5371093,0%20-0.8544922,0.4003906%20-0.3149414,0.4003906%20-0.3149414,1.0913086%200,0.6884766%200.3149414,1.0888672%200.3173829,0.4003906%200.8544922,0.4003906%200.5371094,0%200.8496094,-0.4003906%200.3149414,-0.4003906%200.3149414,-1.0888672%200,-0.690918%20-0.3149414,-1.0913086%20-0.3125,-0.4003906%20-0.8496094,-0.4003906%20z%20m%200,-0.4003906%20q%200.7666016,0%201.225586,0.5151367%200.4589843,0.5126953%200.4589843,1.3769531%200,0.8618164%20-0.4589843,1.3769531%20-0.4589844,0.5126953%20-1.225586,0.5126953%20-0.7690429,0%20-1.2304687,-0.5126953%20-0.4589844,-0.5126953%20-0.4589844,-1.3769531%200,-0.8642578%200.4589844,-1.3769531%200.4614258,-0.5151367%201.2304687,-0.5151367%20z'%20/%3e%3cpath%20style='fill:%23000000;fill-opacity:1'%20id='path4210'%20d='m%208.5250921,6.074913%200.4931641,0%200,1.5405274%201.6357418,-1.5405274%200.634766,0%20-1.809082,1.6992188%201.938477,1.9458008%20-0.649415,0%20-1.7504878,-1.7553711%200,1.7553711%20-0.4931641,0%200,-3.6450196%20z'%20/%3e%3c/g%3e%3c/g%3e%3c/g%3e%3c/svg%3e");}
  .header-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generated%20by%20IcoMoon.io%20--%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='28'%20height='28'%20viewBox='0%200%2028%2028'%3e%3cpath%20fill='%23444'%20d='M26.281%2026q-0.688%200-2.070-0.055t-2.086-0.055q-0.688%200-2.063%200.055t-2.063%200.055q-0.375%200-0.578-0.32t-0.203-0.711q0-0.484%200.266-0.719t0.609-0.266%200.797-0.109%200.703-0.234q0.516-0.328%200.516-2.188l-0.016-6.109q0-0.328-0.016-0.484-0.203-0.063-0.781-0.063h-10.547q-0.594%200-0.797%200.063-0.016%200.156-0.016%200.484l-0.016%205.797q0%202.219%200.578%202.562%200.25%200.156%200.75%200.203t0.891%200.055%200.703%200.234%200.313%200.711q0%200.406-0.195%200.75t-0.57%200.344q-0.734%200-2.18-0.055t-2.164-0.055q-0.672%200-2%200.055t-1.984%200.055q-0.359%200-0.555-0.328t-0.195-0.703q0-0.469%200.242-0.703t0.562-0.273%200.742-0.117%200.656-0.234q0.516-0.359%200.516-2.234l-0.016-0.891v-12.703q0-0.047%200.008-0.406t0-0.57-0.023-0.602-0.055-0.656-0.102-0.57-0.172-0.492-0.25-0.281q-0.234-0.156-0.703-0.187t-0.828-0.031-0.641-0.219-0.281-0.703q0-0.406%200.187-0.75t0.562-0.344q0.719%200%202.164%200.055t2.164%200.055q0.656%200%201.977-0.055t1.977-0.055q0.391%200%200.586%200.344t0.195%200.75q0%200.469-0.266%200.68t-0.602%200.227-0.773%200.063-0.672%200.203q-0.547%200.328-0.547%202.5l0.016%205q0%200.328%200.016%200.5%200.203%200.047%200.609%200.047h10.922q0.391%200%200.594-0.047%200.016-0.172%200.016-0.5l0.016-5q0-2.172-0.547-2.5-0.281-0.172-0.914-0.195t-1.031-0.203-0.398-0.773q0-0.406%200.195-0.75t0.586-0.344q0.688%200%202.063%200.055t2.063%200.055q0.672%200%202.016-0.055t2.016-0.055q0.391%200%200.586%200.344t0.195%200.75q0%200.469-0.273%200.688t-0.625%200.227-0.805%200.047-0.688%200.195q-0.547%200.359-0.547%202.516l0.016%2014.734q0%201.859%200.531%202.188%200.25%200.156%200.719%200.211t0.836%200.070%200.648%200.242%200.281%200.695q0%200.406-0.187%200.75t-0.562%200.344z'%3e%3c/path%3e%3c/svg%3e");}
  .para-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generated%20by%20IcoMoon.io%20--%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='20'%20height='28'%20viewBox='0%200%2020%2028'%3e%3cpath%20fill='%23444'%20d='M19.969%202.953v1.141q0%200.453-0.289%200.953t-0.664%200.5q-0.781%200-0.844%200.016-0.406%200.094-0.5%200.484-0.047%200.172-0.047%201v18q0%200.391-0.281%200.672t-0.672%200.281h-1.687q-0.391%200-0.672-0.281t-0.281-0.672v-19.031h-2.234v19.031q0%200.391-0.273%200.672t-0.68%200.281h-1.687q-0.406%200-0.68-0.281t-0.273-0.672v-7.75q-2.297-0.187-3.828-0.922-1.969-0.906-3-2.797-1-1.828-1-4.047%200-2.594%201.375-4.469%201.375-1.844%203.266-2.484%201.734-0.578%206.516-0.578h7.484q0.391%200%200.672%200.281t0.281%200.672z'%3e%3c/path%3e%3c/svg%3e");}
  .date-input{background-image:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Generated%20by%20IcoMoon.io%20--%3e%3c!DOCTYPE%20svg%20PUBLIC%20'-//W3C//DTD%20SVG%201.1//EN'%20'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3e%3csvg%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20xmlns:xlink='http://www.w3.org/1999/xlink'%20width='32'%20height='32'%20viewBox='0%200%2032%2032'%3e%3cpath%20d='M12.048%2016.961c-0.178%200.257-0.395%200.901-0.652%201.059-0.257%200.157-0.547%200.267-0.869%200.328-0.323%200.062-0.657%200.089-1.002%200.079v1.527h2.467v6.046h1.991v-9.996h-1.584c-0.056%200.381-0.173%200.7-0.351%200.957zM23%208h2c0.553%200%201-0.448%201-1v-6c0-0.552-0.447-1-1-1h-2c-0.553%200-1%200.448-1%201v6c0%200.552%200.447%201%201%201zM7%208h2c0.552%200%201-0.448%201-1v-6c0-0.552-0.448-1-1-1h-2c-0.552%200-1%200.448-1%201v6c0%200.552%200.448%201%201%201zM30%204h-2v5c0%200.552-0.447%201-1%201h-6c-0.553%200-1-0.448-1-1v-5h-8v5c0%200.552-0.448%201-1%201h-6c-0.552%200-1-0.448-1-1v-5h-2c-1.104%200-2%200.896-2%202v24c0%201.104%200.896%202%202%202h28c1.104%200%202-0.896%202-2v-24c0-1.104-0.896-2-2-2zM30%2029c0%200.553-0.447%201-1%201h-26c-0.552%200-1-0.447-1-1v-16c0-0.552%200.448-1%201-1h26c0.553%200%201%200.448%201%201v16zM15.985%2017.982h4.968c-0.936%201.152-1.689%202.325-2.265%203.705-0.575%201.381-0.638%202.818-0.749%204.312h2.131c0.009-0.666-0.195-1.385-0.051-2.156%200.146-0.771%200.352-1.532%200.617-2.285%200.267-0.752%200.598-1.461%200.996-2.127%200.396-0.667%200.853-1.229%201.367-1.686v-1.742h-7.015v1.979z'%3e%3c/path%3e%3c/svg%3e"); background-size: 75%;
    background-repeat: no-repeat;
    background-position: 3px 3px;}
.icon-form-builder{width: 24px;
  color: var(--content-contentsecondary);
  height: 24px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;}
  #textarea-field{height: 60px;}
  .hideForm{display: none;}

.workflowCode .ui-resizable-s{bottom: 0px!important;}
.custom-canvas{
  background-color: var(--background-light);
  background-repeat: repeat;
  height: 100%;
  overflow: auto;
  position: relative;
  z-index: 0;
  width: 100%;
  }
  .customDragableContent {
    height: 590px;
}
.customDragableContent .row{height: 100%;}
  #processTemplateTabsContent{background:var(--background-base);}
  .custom-text-right{text-align: right; margin-right: 22px;}
  #n-columns{padding: 0px 15px 0px 10px;}
#n-columns_label + .k-dropdownlist{width: 170px;}


.customdropableBlock{
  cursor: move;
  background-color: var(--background-light);
  border: 1px solid var(--border-borderbase);
  display: flex;
  justify-content: space-between;
  padding: 14px 12px;
  align-items: center;
  margin-bottom: 16px;
}

.customdropableBlock *{padding: 0;margin: 0;}
.droppable-active, .dropableBoxActive {
  list-style-type: none;
  margin: 0;
  color: #666;
  cursor: move;
  border: 1px dashed var(--border-borderbase) !important;
  background: rgba(215, 236, 253,0.6);
  position: relative;
}
	.removeDroppedItem {cursor: pointer;padding: 0;margin: 0;position: absolute;z-index: 9;right: 0;}
	.removeDroppedItem span { margin: 0 4px;}
	
  .removeDroppedItem span.drag { margin-top: -10px;}
  .removeDroppedItem span.drag:before { font-size: 5.5px;}
  .removeDroppedItem span:before { font-size: 16px;color: var(--content-contentsecondary);}
	
	.draggable { cursor: move; }
  .customDropableBox > div {
    min-height: 100px;
    border: 1px dashed var(--border-borderbase2);
}
.customDropableBox .k-floating-label-container{margin: 6px 0;}
.customDropableBox .input-group{margin: 3px 0;}
.customDropableBox .droppable.sortable{position: relative;}
.customDropableBox.oneColumn{margin: 0;}
.custom-canvas .customDropableBox{border: 0;position: relative;padding-right: 42px}
.custom-canvas .customDropableBox:before, .custom-canvas .customDropableBox:after{position: absolute;content:"";width: 60px;height: 1px;border-top: 1px dashed var(--border-borderbase2);right: 0px;top: 0;}
.custom-canvas .customDropableBox:after{position: absolute;}
.custom-canvas .customDropableBox:last-child{padding: 0;height: 100%;}
.custom-canvas .customDropableBox input[id^="hidden-input-"]{    margin: 26px 0 6px;padding:7.2px 10px;display: inline;border: 1px dashed var(--hcl-blue10);background: var(--background-base);}
.custom-canvas .customDropableBox textarea{height: 40px;}

.twoColumn .droppable.sortable{display: flex;flex-wrap: wrap;height: 100%;position: relative;z-index: 99;width: 100%;}
.twoColumn .droppable.sortable > div{width: 33.333% !important; padding: 0 15px;}
.oneColumn .droppable.sortable > div{width: 100%; padding: 0 15px;}
.threeColumn, .threeColumn .droppable.sortable{display: flex;flex-wrap: wrap;align-items: start;justify-content: space-between;min-height: 250px;}
.threeColumn .droppable.sortable{width: 66.666%;}
.leftDragableContent{overflow: auto;height: 100%;}
.leftDragableContent .customDragableBlock{position: relative;}
.leftDragableContent .customDragableBlock:after {content: "\e9c8";position: absolute;font-family: 'myicons', sans-serif !important;font-size: 5.5px;right: 8px;top: 0;bottom: 0;margin: auto;display: flex;align-items: center;}
.leftDragableContent .form-group{margin: 10px 0;}
.leftDragableContent h3{ 
  font-size: 1.1rem;
}
.empty-form{position: absolute;width: 100%;height: 100%;top: 0;bottom: 0;left: 0;right: 0;margin: auto;text-align: center;}
.empty-form p{width: 100%;}
#customControlTabsContent .defaultHeadingPara{display: none;}
#customControlTabsContent .defaultHeadingPara h2{font-size: 1.4rem;}
#customControlTabsContent .threeColumn .defaultHeadingPara{display: block;width: 33.33%;padding: 12px;border: 1px dashed var(--border-borderbase2);}
 #customControlTabsContent .threeColumn .droppable.sortable:not(.defaultHeadingPara) > div{width: 50% !important; padding: 0 12px;}
 .preventDefault{pointer-events: none;}
 .custom-canvas .customDropableBox:last-child .upDownDraggable{display: none;}
 .custom-canvas .customDropableBox .upDownDraggable{position: absolute;right: 0;top: 0;margin: auto;display: flex;align-items: center;flex-direction: column;justify-content: center;z-index: 99;border: 0;}
 .custom-canvas .customDropableBox .upDownDraggable .drag{font-size: 6px;color: var(--content-contentsecondary);}
 .customDropableBox:first-child:nth-last-child(2) .upArrow, .customDropableBox:first-child:nth-last-child(2) .downArrow{display: none;}
 .customDropableBox:nth-last-child(2):not(:first-child)  .downArrow{display: none;}
 .customResizable .ui-resizable-handle:not(.ui-icon-gripsmall-diagonal-se){font-size: initial;background-color: #000;}
 .customResizable .ui-resizable-handle.ui-resizable-e{width: 12px;}
 .customResizable .ui-resizable-handle.ui-resizable-s{height: 12px;}
.customResizable .ui-resizable-handle:after{content: "\e9d1";position: absolute;font-family: 'myicons', sans-serif !important;width: 20px;height: 20px;top: 12%;bottom: 0;margin: auto;color: #fff;left: -2px;right: 0;}
 .customResizable .ui-resizable-handle:nth-last-child(2):after{transform: rotate(90deg);}
 .customResizable .details-list-section{position: relative;z-index: 99;}
 .customResizable .details-list-section:after{content: "";position: absolute;height: 103%;width: 16px;background: var(--steps_content_bg);right: -9px;top: 0px;bottom: 0;z-index: 99;}
 .viewTemplateDraggable .drag{font-size: 6px;margin: auto;display: flex;align-items: center;}
 .viewTemplateDraggable p{padding: 0;margin: 0;}
 .viewTemplateDraggable p:first-child{width: 100%;}
 .viewTemplateDraggable{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;}
 .viewTemplateDraggable li{width: 32%;background: var(--background-light);padding: 8px 12px;margin-bottom: 16px;border: 1px solid var(--border-borderbase);position: relative;border-radius: 4px;}
 .viewTemplateDraggable .disabled{opacity: 0.5;}

/* End Drag and Drop Functionality CSS */


/* Start heirarchy menu CSS */
.configureMenuGroup {
  border: 1px solid var(--border-borderbase);
  border-radius: 4px;
}
.configureMenuGroup li {
  padding: 10px 20px 10px 10px;
  background-color: var(--background-light);
  border-bottom: 1px solid var(--border-borderbase);
  cursor: pointer;
  height: 46px;
  position: relative;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  font-size: 0.9rem;
  display: flex;
  align-items: center;
}

.configureMenuGroup li:hover, .configureMenuGroup li.active {
  background: var(--hcl-blue10);
  font-weight: 500;
}

.configureMenuGroup ul li:after{
  content: "";
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 100px;
  background: var(--background-positive);
  right: 10px;
  top: 0;
  bottom: 0;
  margin: auto;
  display: none;
}

.configureMenuGroup ul li.active:after{
  display: block;
}

.configureMenuGroup.withoutDot ul li.active:after{
    display: none;
}

.configureMainMenu {
  border: 1px solid var(--border-borderbase);
  border-radius: 4px;
  
}
.configureMainMenu li{
  padding: 10px 10px;
  cursor: pointer;
  border-bottom: 1px solid var(--border-borderbase);
  position: relative;
  height: 46px;
}
.configureMainMenu li ul {position: absolute;right: -100%;width: 100%;top: 0;display: none;border: 1px solid var(--border-borderbase);background: var(--white);z-index: 9;}
.configureMainMenu li:hover > ul{display: block;}
.configureMainMenu li:hover{background: var(--hcl-blue10);}
.configureInnerLink{width: calc(100% - 30px);}
.top-search .input-group-prepend{display: flex;}
/* end heirarchy menu CSS */




 /* width */
 .customScroller::-webkit-scrollbar, .custom-canvas::-webkit-scrollbar, .tab-content::-webkit-scrollbar, .k-list-content::-webkit-scrollbar, .k-auto-scrollable::-webkit-scrollbar,
 .daterangepicker select.hourselect::-webkit-scrollbar, .daterangepicker select.minuteselect::-webkit-scrollbar, .daterangepicker select.secondselect::-webkit-scrollbar, .daterangepicker select.ampmselect::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

/* Track */
.customScroller::-webkit-scrollbar-track, .custom-canvas::-webkit-scrollbar-track, .tab-content::-webkit-scrollbar-track, .k-list-content::-webkit-scrollbar-track, .k-auto-scrollable::-webkit-scrollbar-track,
.daterangepicker select.hourselect::-webkit-scrollbar-track, .daterangepicker select.minuteselect::-webkit-scrollbar-track, .daterangepicker select.secondselect::-webkit-scrollbar-track, .daterangepicker select.ampmselect::-webkit-scrollbar-track {
background: var(--gray-05);
}

/* Handle */
.customScroller::-webkit-scrollbar-thumb, .custom-canvas::-webkit-scrollbar-thumb, .tab-content::-webkit-scrollbar-thumb, .k-list-content::-webkit-scrollbar-thumb, .k-auto-scrollable::-webkit-scrollbar-thumb,
.daterangepicker select.hourselect::-webkit-scrollbar-thumb, .daterangepicker select.minuteselect::-webkit-scrollbar-thumb, .daterangepicker select.secondselect::-webkit-scrollbar-thumb, .daterangepicker select.ampmselect::-webkit-scrollbar-thumb {
background: #888;
border-radius: 6px;
}

/* Handle on hover */
.customScroller::-webkit-scrollbar-thumb:hover, .custom-canvas::-webkit-scrollbar-thumb:hover, .tab-content::-webkit-scrollbar-thumb:hover, .k-list-content::-webkit-scrollbar-thumb:hover, .k-auto-scrollable::-webkit-scrollbar-thumb:hover,
.daterangepicker select.hourselect::-webkit-scrollbar-thumb:hover, .daterangepicker select.minuteselect::-webkit-scrollbar-thumb:hover, .daterangepicker select.secondselect::-webkit-scrollbar-thumb:hover, .daterangepicker select.ampmselect::-webkit-scrollbar-thumb:hover {
background: #555;
}


.border-top,.border-bottom,.border-start,.border-end {
  border-color:var(--border-borderbase) !important;
}

.border-left{
  border-left: var(--width-xs) solid var(--border-bordercustom);
    padding-left: 16px;
}
.p-2{
  padding: 0.5rem !important;
}

/* @media screen and (max-width: 1368px){
  html, body, html.regular_scale, body.regular_scale{font-size: var(--small);}
  html.small_scale, body.small_scale{font-size: 13px;}
  
} */

  .toggle.toggle-sm{width: 50px;}
  .toggle.toggle-sm:before{height: 18px;top: 8px;}
  .toggle.toggle-sm span{width: 22px;height: 22px;top: 6px;}

  .informationSummary {border: 1px solid var(--border-borderbase);border-radius: 4px;background: var(--background-bgcard);padding: 16px;}
  .informationSummary > .informationSummary{background: var(--background-bgcard) ;}
  .informationSummary .informationSummary--title{color: var(--content-contentbase);font-size: 1.1rem;}
  .informationSummary ul li{width: 20%;padding: 16px;position: relative;}
  .informationSummary ul li:after{content: "";position: absolute;width: 1px; height: 50%;background-color: var(--border-borderbase);left: 0;top: 0;bottom: 0;margin: auto;}
  .informationSummary ul li:nth-child(4n+1):after{display: none;}
  .informationSummary ul li span:first-child{color: var(--content-contentsecondary);font-size: 0.93rem; font-weight: var(--font-weight-400);}
  .informationSummary ul li span:nth-child(2){color: var(--content-contentbase);font-size: 0.98rem;font-weight: 500;}
  .background-bgcard{background-color: var(--background-bgcard) !important;}
  .badge{
    display: inline-block;
    padding: .35em .65em;
    font-size: .85em;
    font-weight: 600;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    border-radius: .25rem;
    text-transform: capitalize;
  }
  .mt-1{
    margin-top: 0.25rem !important;
  }
  .drawer-wd-800{
    width: 730px !important;
  }
  .d-block{display: block !important;}
  .flex-wrap{flex-wrap: wrap !important;}
  .border-bottom{
    border-bottom: 1px solid var(--border-borderbase) !important;
  }
  .pb-3{
    padding-bottom: 1rem !important;
  }
  .mb-3{
    margin-bottom: 1rem !important;
  }
  .ps-0{
    padding-left: 0 !important;
  }
  .pt-0{
    padding-top: 0 !important;
  }
  
  .float-rt-close{
    float: right;
    cursor: pointer;
  }
  .text-color-tertiary{
    color: var(--content-contenttertiary) !important;
  }
  .fontSize24{
    font-size: 1.7rem !important;
  }
  
  /* Start Alert View Cards */
  .alertViewsCards ul li{border: 0;position: relative;padding: 0 16px;}
  .alertViewsCards ul li:first-child{padding-left: 0;}
   .alertViewsCards ul li span:first-child{padding-bottom: 4px;}
  .alertViewsCards ul li:after{content: "";position: absolute;right: 0;width: 1px;height: 70%;background: var(--border-borderbase);margin: auto;top: 0;bottom: 0;}
  .alertViewsCards ul li:last-child:after{display: none;}
  /* End Alert View Cards */@font-face {
  font-family: 'myicons';
  src:
    url('/assets/myicons-DWVv9eB8.ttf?9mzs9c') format('truetype'),
    url('/assets/myicons-C3oIw82R.woff?9mzs9c') format('woff'),
    url('/assets/myicons-BXJiek0R.svg?9mzs9c#myicons') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.myicons {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'myicons', sans-serif !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  
  /* Enable Ligatures ================ */
  letter-spacing: 0;
  -webkit-font-feature-settings: "liga";
  -moz-font-feature-settings: "liga=1";
  -moz-font-feature-settings: "liga";
  -ms-font-feature-settings: "liga" 1;
  font-feature-settings: "liga";
  -webkit-font-variant-ligatures: discretionary-ligatures;
  font-variant-ligatures: discretionary-ligatures;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1rem;
}

.rotate-keyy:before {
  content: "\e900";
}
.file-check:before {
  content: "\e901";
}
.share-2:before {
  content: "\e902";
}
.google-cloud-svgrepo-com:before {
  content: "\e903";
}
.WindowsIcon:before {
  content: "\e904";
}
.SwitchIcon-converted:before {
  content: "\e905";
}
.StorageIcon:before {
  content: "\e906";
}
.RouterIcon-converted:before {
  content: "\e907";
}
.Miscellaneous:before {
  content: "\e908";
}
.LoadBalancerIcon:before {
  content: "\e909";
}
.LinuxIcon:before {
  content: "\e90a";
}
.uniE908:before {
  content: "\e90b";
}
.uniE909:before {
  content: "\e90c";
}
.uniE90A:before {
  content: "\e90d";
}
.uniE90B:before {
  content: "\e90e";
}
.FirewallIcon:before {
  content: "\e90f";
}
.Azure-Gray:before {
  content: "\e910";
}
.AWSIcon:before {
  content: "\e911";
}
.othersIcon-converted:before {
  content: "\e912";
}
.ESXI-Icon:before {
  content: "\e913";
}
.database:before {
  content: "\e914";
}
.ship-wheel:before {
  content: "\e915";
}
.add-alt:before {
  content: "\e916";
}
.add-filled:before {
  content: "\e917";
}
.add-user:before {
  content: "\e918";
}
.add:before {
  content: "\e919";
}
.alarm:before {
  content: "\e91a";
}
.analytics:before {
  content: "\e91b";
}
.arrow-down-left:before {
  content: "\e91c";
}
.arrow-down-right:before {
  content: "\e91d";
}
.arrow-down:before {
  content: "\e91e";
}
.arrow-left:before {
  content: "\e91f";
}
.arrow-right:before {
  content: "\e920";
}
.arrow-up-left:before {
  content: "\e921";
}
.arrow-up-right:before {
  content: "\e922";
}
.arrow-up:before {
  content: "\e923";
}
.arrows-horizontal:before {
  content: "\e924";
}
.arrows-vertical1:before {
  content: "\e925";
}
.attachment:before {
  content: "\e926";
}
.book:before {
  content: "\e927";
}
.bookmark-add:before {
  content: "\e928";
}
.bookmark-filled:before {
  content: "\e929";
}
.calendar-settings:before {
  content: "\e92a";
}
.calendar:before {
  content: "\e92b";
}
.caret-down:before {
  content: "\e92c";
}
.caret-left:before {
  content: "\e92d";
}
.caret-right:before {
  content: "\e92e";
}
.caret-up:before {
  content: "\e92f";
}
.catalog-publishsvg:before {
  content: "\e930";
}
.catalog:before {
  content: "\e931";
}
.certificate-check:before {
  content: "\e932";
}
.change-catalog:before {
  content: "\e933";
}
.chart-custom:before {
  content: "\e934";
}
.chat-launch:before {
  content: "\e935";
}
.chat-off:before {
  content: "\e936";
}
.chat:before {
  content: "\e937";
}
.checkmark-filled:before {
  content: "\e938";
}
.checkmark-outline:before {
  content: "\e939";
}
.checkmark:before {
  content: "\e93a";
}
.chevron-down:before {
  content: "\e93b";
}
.chevron-left-double:before {
  content: "\e93c";
}
.chevron-left:before {
  content: "\e93d";
}
.chevron-right-double:before {
  content: "\e93e";
}
.chevron-right:before {
  content: "\e93f";
}
.chevron-up:before {
  content: "\e940";
}
.close-filled:before {
  content: "\e941";
}
.close-outline:before {
  content: "\e942";
}
.close:before {
  content: "\e943";
}
.code:before {
  content: "\e944";
}
.config:before {
  content: "\e945";
}
.content-view:before {
  content: "\e946";
}
.cookie:before {
  content: "\e947";
}
.copy:before {
  content: "\e948";
}
.dashboard1:before {
  content: "\e949";
}
.data-base-alt:before {
  content: "\e94a";
}
.data-protect:before {
  content: "\e94b";
}
.document-attachment:before {
  content: "\e94c";
}
.download:before {
  content: "\e94d";
}
.edit:before {
  content: "\e94e";
}
.email:before {
  content: "\e94f";
}
.enterprise:before {
  content: "\e950";
}
.error-outline:before {
  content: "\e951";
}
.error:before {
  content: "\e952";
}
.event-schedule:before {
  content: "\e953";
}
.export:before {
  content: "\e954";
}
.face-dissatisfied:before {
  content: "\e955";
}
.face-neutral:before {
  content: "\e956";
}
.face-satisfied:before {
  content: "\e957";
}
.filter-edit:before {
  content: "\e958";
}
.filter-remove:before {
  content: "\e959";
}
.filter-reset:before {
  content: "\e95a";
}
.filter1:before {
  content: "\e95b";
}
.group-access:before {
  content: "\e95c";
}
.group-presentation:before {
  content: "\e95d";
}
.gui-management:before {
  content: "\e95e";
}
.help-filled:before {
  content: "\e95f";
}
.help:before {
  content: "\e960";
}
.home:before {
  content: "\e961";
}
.iautomate-logo:before {
  content: "\e962";
}
.id-management:before {
  content: "\e963";
}
.identification:before {
  content: "\e964";
}
.image-copy:before {
  content: "\e965";
}
.image:before {
  content: "\e966";
}
.information-disabled:before {
  content: "\e967";
}
.information-filled:before {
  content: "\e968";
}
.information-square-filled:before {
  content: "\e969";
}
.information-square:before {
  content: "\e96a";
}
.information:before {
  content: "\e96b";
}
.knowledge-catalog:before {
  content: "\e96c";
}
.language:before {
  content: "\e96d";
}
.license-global:before {
  content: "\e96e";
}
.license-maintenance:before {
  content: "\e96f";
}
.list-dropdown:before {
  content: "\e970";
}
.location-current:before {
  content: "\e971";
}
.location-filled:before {
  content: "\e972";
}
.location1:before {
  content: "\e973";
}
.login:before {
  content: "\e974";
}
.mail-all:before {
  content: "\e975";
}
.microphone:before {
  content: "\e976";
}
.mycloud-logo:before {
  content: "\e977";
}
.notebook:before {
  content: "\e978";
}
.notification:before {
  content: "\e979";
}
.operations-record:before {
  content: "\e97a";
}
.order-details:before {
  content: "\e97b";
}
.overflow-menu-vertical:before {
  content: "\e97c";
}
.parameter:before {
  content: "\e97d";
}
.password:before {
  content: "\e97e";
}
.pause-outline:before {
  content: "\e97f";
}
.play:before {
  content: "\e980";
}
.playlist:before {
  content: "\e981";
}
.power:before {
  content: "\e982";
}
.presentation-file:before {
  content: "\e983";
}
.priority-icon:before {
  content: "\e984";
}
.refresh:before {
  content: "\e985";
}
.report-data:before {
  content: "\e986";
}
.report:before {
  content: "\e987";
}
.request-quote:before {
  content: "\e988";
}
.reset:before {
  content: "\e989";
}
.rule-cancelled:before {
  content: "\e98a";
}
.rule-test:before {
  content: "\e98b";
}
.rule:before {
  content: "\e98c";
}
.run:before {
  content: "\e98d";
}
.script-reference:before {
  content: "\e98e";
}
.search-advanced:before {
  content: "\e98f";
}
.search-locate:before {
  content: "\e990";
}
.search:before {
  content: "\e991";
}
.security-services:before {
  content: "\e992";
}
.send-alt-filled:before {
  content: "\e993";
}
.send-alt:before {
  content: "\e994";
}
.send-filled:before {
  content: "\e995";
}
.send:before {
  content: "\e996";
}
.server-proxy:before {
  content: "\e997";
}
.settings-adjust:before {
  content: "\e998";
}
.settings-view:before {
  content: "\e999";
}
.settings:before {
  content: "\e99a";
}
.share-knowledge:before {
  content: "\e99b";
}
.sop:before {
  content: "\e99c";
}
.state-current:before {
  content: "\e99d";
}
.state-notactive:before {
  content: "\e99e";
}
.study-skip:before {
  content: "\e99f";
}
.table1:before {
  content: "\e9a0";
}
.tag:before {
  content: "\e9a1";
}
.task-tools:before {
  content: "\e9a2";
}
.text--creation:before {
  content: "\e9a3";
}
.text--indent:before {
  content: "\e9a4";
}
.text-scale:before {
  content: "\e9a5";
}
.thumbs-down:before {
  content: "\e9a6";
}
.thumbs-up1:before {
  content: "\e9a7";
}
.ticket:before {
  content: "\e9a8";
}
.time:before {
  content: "\e9a9";
}
.tools:before {
  content: "\e9aa";
}
.trash-can:before {
  content: "\e9ab";
}
.trusted-advisor-logo:before {
  content: "\e9ac";
}
.user-avatar:before {
  content: "\e9ad";
}
.user-certification:before {
  content: "\e9ae";
}
.user-filled-alt:before {
  content: "\e9af";
}
.user-filled:before {
  content: "\e9b0";
}
.user-multiple:before {
  content: "\e9b1";
}
.user-settings:before {
  content: "\e9b2";
}
.view-filled:before {
  content: "\e9b3";
}
.view-off-filled:before {
  content: "\e9b4";
}
.view-off:before {
  content: "\e9b5";
}
.view:before {
  content: "\e9b6";
}
.warning-alt-filled:before {
  content: "\e9b7";
}
.warning-alt:before {
  content: "\e9b8";
}
.warning-square-filled:before {
  content: "\e9b9";
}
.warning-square:before {
  content: "\e9ba";
}
.add-comment:before {
  content: "\e9bb";
}
.auto-training:before {
  content: "\e9bc";
}
.chat-assistant:before {
  content: "\e9bd";
}
.chat-operational:before {
  content: "\e9be";
}
.desktop-secure:before {
  content: "\e9bf";
}
.desktop-service-management:before {
  content: "\e9c0";
}
.document-security:before {
  content: "\e9c1";
}
.fish-multiple:before {
  content: "\e9c2";
}
.flag-filled:before {
  content: "\e9c3";
}
.flag:before {
  content: "\e9c4";
}
.laptop:before {
  content: "\e9c5";
}
.light-filled:before {
  content: "\e9c6";
}
.light:before {
  content: "\e9c7";
}
.lucy-logo:before {
  content: "\e9c8";
}
.pause-filled:before {
  content: "\e9c9";
}
.pause-outline-filled:before {
  content: "\e9ca";
}
.phone-settings:before {
  content: "\e9cb";
}
.play-filled-alt:before {
  content: "\e9cc";
}
.play-filled:before {
  content: "\e9cd";
}
.play-outline-filled:before {
  content: "\e9ce";
}
.play-outline:before {
  content: "\e9cf";
}
.screen:before {
  content: "\e9d0";
}
.server-dns:before {
  content: "\e9d1";
}
.settings-services:before {
  content: "\e9d2";
}
.subtract-alt:before {
  content: "\e9d3";
}
.subtract:before {
  content: "\e9d4";
}
.task-settings:before {
  content: "\e9d5";
}
.tool-kit:before {
  content: "\e9d6";
}
.user-admin:before {
  content: "\e9d7";
}
.user-service-desk:before {
  content: "\e9d8";
}
.information-circle:before {
  content: "\e9d9";
}
.shoping-cart:before {
  content: "\e9da";
}
.paragraph:before {
  content: "\e9db";
}
.heading:before {
  content: "\e9dc";
}
.textarea:before {
  content: "\e9dd";
}
.drag:before {
  content: "\e9de";
}
.selectbox:before {
  content: "\e9df";
}
.input-password:before {
  content: "\e9e0";
}
.textbox:before {
  content: "\e9e1";
}
.input-radio:before {
  content: "\e9e2";
}
.input-checked:before {
  content: "\e9e3";
}
.input-button:before {
  content: "\e9e4";
}
.input-hidden:before {
  content: "\e9e5";
}
.drag-horizontal:before {
  content: "\e9e6";
}
.draggableIcon:before {
  content: "\e9e7";
}
.arrows-vertical:before {
  content: "\e9e8";
}
.column-settings:before {
  content: "\e9e9";
}
.justify:before {
  content: "\e9ea";
}
.link:before {
  content: "\e9eb";
}
.list:before {
  content: "\e9ec";
}
.organization:before {
  content: "\e9ed";
}
.presentation:before {
  content: "\e9ee";
}
.summary:before {
  content: "\e9ef";
}
.calendar-period-selected:before {
  content: "\e9f0";
}
.calendar-period:before {
  content: "\e9f1";
}
.chart-analysis-selected:before {
  content: "\e9f2";
}
.chart-analysis:before {
  content: "\e9f3";
}
.dashboard-selected:before {
  content: "\e9f4";
}
.dashboard:before {
  content: "\e9f5";
}
.database1:before {
  content: "\e9f6";
}
.elevation:before {
  content: "\e9f7";
}
.grid-selected:before {
  content: "\e9f8";
}
.grid:before {
  content: "\e9f9";
}
.heart-selected:before {
  content: "\e9fa";
}
.heart:before {
  content: "\e9fb";
}
.logout:before {
  content: "\e9fc";
}
.mosaic-selected:before {
  content: "\e9fd";
}
.mosaic:before {
  content: "\e9fe";
}
.pin-selected:before {
  content: "\e9ff";
}
.pin:before {
  content: "\ea00";
}
.program-kanban:before {
  content: "\ea01";
}
.star-selected:before {
  content: "\ea02";
}
.star:before {
  content: "\ea03";
}
.thumbs-up:before {
  content: "\ea04";
}
.chart_type_421:before {
  content: "\ea05";
}
.location:before {
  content: "\ea06";
}
.variable-table:before {
  content: "\ea07";
}
.Chart_type_10:before {
  content: "\ea08";
}
.Chart_type_14:before {
  content: "\ea09";
}
.Chart_type_15:before {
  content: "\ea0a";
}
.Chart_type_19:before {
  content: "\ea0b";
}
.chart_type_26:before {
  content: "\ea0c";
}
.chart_type_27:before {
  content: "\ea0d";
}
.chart_type_42:before {
  content: "\ea0e";
}
.Chart_type_43:before {
  content: "\ea0f";
}
.Chart_type_67:before {
  content: "\ea10";
}
.Chart_type_line:before {
  content: "\ea11";
}
.vCenter-configuration:before {
  content: "\ea12";
}
.SNMP-bulk-upload:before {
  content: "\ea13";
}
.object-group:before {
  content: "\ea14";
}
.manage:before {
  content: "\ea15";
}
.node-configuration:before {
  content: "\ea16";
}
.nodes:before {
  content: "\ea17";
}
.maintenance-windows:before {
  content: "\ea18";
}
.logs:before {
  content: "\ea19";
}
.analyzer:before {
  content: "\ea1a";
}
.Intersect:before {
  content: "\ea1b";
}
.add-node:before {
  content: "\ea1c";
}
.alerts-view:before {
  content: "\ea1d";
}
.configuration:before {
  content: "\ea1e";
}
.dashboard2:before {
  content: "\ea1f";
}
.device-credentials:before {
  content: "\ea20";
}
.events:before {
  content: "\ea21";
}
.module-access-request:before {
  content: "\ea22";
}
.roles:before {
  content: "\ea23";
}
.rule-configuration:before {
  content: "\ea24";
}
.user-management:before {
  content: "\ea25";
}
.users:before {
  content: "\ea26";
}
.template-configuration:before {
  content: "\ea27";
}
.user-groups:before {
  content: "\ea28";
}
.Incident-configurationevent:before {
  content: "\ea29";
}:root {
    /* HCL Software Primitive */
--blue-100: #E8F4FF;
--blue-200: #C5E3FF;
--blue-300: #9DCDFF;
--blue-400: #6FAFFD;
--blue-500: #3C91FF;
--blue-600: #2679FF;
--blue-700: #0550DC;
--blue-800: #0029A9;
--blue-900: #0029A9;
--blue-1000: #000078;
--cyan-50: #E4F9FF;
--cyan-100: #CEF1FC;
--cyan-200: #9DE3FA;
--cyan-300: #6CD4F7;
--cyan-400: #3BC6F5;
--cyan-500: #0AB8F2;
--cyan-600: #0893C2;
--cyan-700: #066E91;
--cyan-800: #044A61;
--cyan-900: #022530;
--red-100: #FFF2F2;
--red-200: #FFCECE;
--red-300: #FFADAD;
--red-400: #FF7A7A;
--red-500: #F95454;
--red-600: #F52929;
--red-700: #EB0909;
--red-800: #C10C0D;
--red-900: #A00C0C;
--red-1000: #730C0C;
--orange-100: #FFF6E2;
--orange-200: #FFE1A6;
--orange-300: #FFC766;
--orange-400: #FFAF38;
--orange-500: #FF8A00;
--orange-600: #E26A00;
--orange-700: #C95000;
--orange-800: #AE3D04;
--orange-900: #882E07;
--orange-1000: #691E08;
--yellow-100: #FFFCD5;
--yellow-200: #FFEF86;
--yellow-300: #FFDF41;
--yellow-400: #FFC919;
--yellow-500: #EEA600;
--yellow-600: #CE8200;
--yellow-700: #AE6402;
--yellow-800: #8E4A06;
--yellow-900: #6E3606;
--yellow-1000: #4C2609;
--green-100: #E4FDED;
--green-200: #92F7BA;
--green-300: #41E287;
--green-400: #15D36E;
--green-500: #05BE62;
--green-600: #029C54;
--green-700: #007744;
--green-800: #04633D;
--green-900: #054D33;
--green-1000: #07432F;
--purple-100: #F9EEFF;
--purple-200: #F0D3FF;
--purple-300: #E4B6FF;
--purple-400: #D694F9;
--purple-500: #B476DD;
--purple-600: #9153BB;
--purple-700: #7E40AC;
--purple-800: #6A2E99;
--purple-900: #561A87;
--purple-1000: #460A7A;
--lime-100: #F9FDDE;
--lime-200: #F1F49B;
--lime-300: #E0E86A;
--lime-400: #C7D540;
--lime-500: #A4BB0B;
--lime-600: #8BA702;
--lime-700: #667F00;
--lime-800: #506901;
--lime-900: #3A4D04;
--lime-1000: #2E4005;
--pink-100: #FFECFC;
--pink-200: #FFCBF6;
--pink-300: #FFADEF;
--pink-400: #FF7DE5;
--pink-500: #E753BF;
--pink-600: #C8329F;
--pink-700: #AA157D;
--pink-800: #8F0465;
--pink-900: #71054D;
--pink-1000: #510736;
--teal-100: #D1FAFD;
--teal-200: #74EEF7;
--teal-300: #34DCE8;
--teal-400: #2EC0CB;
--teal-500: #1DB6C0;
--teal-600: #008E94;
--teal-700: #007A87;
--teal-800: #006075;
--teal-900: #1D445D;
--teal-1000: #15384E;
--indigo-100: #EDF5FF;
--indigo-200: #C8DFFF;
--indigo-300: #A9C7FC;
--indigo-400: #789DF4;
--indigo-500: #5C6FCB;
--indigo-600: #4C5AB7;
--indigo-700: #4D4DB9;
--indigo-800: #44339F;
--indigo-900: #362284;
--indigo-1000: #2A1A6A;
--coolgray-5: #F5F5FA;
--coolgray-10: #E4E4F0;
--coolgray-100: #D3D3E5;
--coolgray-200: #C8C8DD;
--coolgray-300: #A8A8BD;
--coolgray-400: #8C8C9F;
--coolgray-500: #717182;
--coolgray-600: #4A4A56;
--coolgray-700: #3F3F4A;
--coolgray-800: #33333D;
--coolgray-900: #1D1D23;
--coolgray-1000: #12131F;
--gray-5: #F2F2F2;
--gray-10: #E6E6E6;
--gray-100: #DEDEDE;
--gray-200: #C6C6C6;
--gray-300: #ADADAD;
--gray-400: #8F8F8F;
--gray-500: #737373;
--gray-600: #5C5C5C;
--gray-700: #474747;
--gray-800: #363636;
--gray-900: #262626;
--gray-1000: #121212;
 /* -/HCL Software Primitive */

/* Light Mode */
--chart-alerts-critical: var(--red-700);
--chart-alerts-warning: var(--orange-500);
--chart-alerts-notice: var(--yellow-500);
--chart-alerts-normal: var(--green-600);
--chart-fullpallete-color01: var(--purple-700);
--chart-fullpallete-color02: var(--red-900);
--chart-fullpallete-color03: var(--green-700);
--chart-fullpallete-color04: var(--yellow-600);
--chart-fullpallete-color05: var(--orange-800);
--chart-fullpallete-color06: var(--blue-500);
--chart-fullpallete-color07: var(--red-500);
--chart-fullpallete-color08: var(--indigo-700);
--chart-fullpallete-color09: var(--teal-600);
--chart-fullpallete-color10: var(--purple-500);
--chart-fullpallete-color11: var(--teal-800);
--chart-fullpallete-color12: var(--red-1000);
--chart-fullpallete-color13: var(--pink-600);
--chart-fullpallete-color14: var(--blue-1000);
--chart-1colorpallete-option01-color01: var(--chart-fullpallete-color01);
--chart-1colorpallete-option02-color01: var(--chart-fullpallete-color08);
--chart-1colorpallete-option03-color01: var(--chart-fullpallete-color06);
--chart-1colorpallete-option04-color01: var(--chart-fullpallete-color11);
--chart-2colorspallete-option01-color01: var(--chart-fullpallete-color01);
--chart-2colorspallete-option01-color02: var(--chart-fullpallete-color09);
--chart-2colorspallete-option02-color01: var(--chart-fullpallete-color10);
--chart-2colorspallete-option02-color02: var(--chart-fullpallete-color12);
--chart-2colorspallete-option03-color01: var(--chart-fullpallete-color02);
--chart-2colorspallete-option03-color02: var(--chart-fullpallete-color12);
--chart-2colorspallete-option04-color01: var(--chart-fullpallete-color06);
--chart-2colorspallete-option04-color02: var(--chart-fullpallete-color11);
--chart-2colorspallete-option05-color01: var(--chart-fullpallete-color09);
--chart-2colorspallete-option05-color02: var(--chart-fullpallete-color14);
--chart-3colorspallete-option01-color01: var(--chart-fullpallete-color10);
--chart-3colorspallete-option01-color02: var(--chart-fullpallete-color11);
--chart-3colorspallete-option01-color03: var(--chart-fullpallete-color02);
--chart-3colorspallete-option02-color01: var(--chart-fullpallete-color02);
--chart-3colorspallete-option02-color02: var(--red-500);
--chart-3colorspallete-option02-color03: var(--chart-fullpallete-color12);
--chart-3colorspallete-option03-color01: var(--chart-fullpallete-color10);
--chart-3colorspallete-option03-color02: var(--chart-fullpallete-color11);
--chart-3colorspallete-option03-color03: var(--chart-fullpallete-color14);
--chart-3colorspallete-option04-color01: var(--chart-fullpallete-color13);
--chart-3colorspallete-option04-color02: var(--chart-fullpallete-color06);
--chart-3colorspallete-option04-color03: var(--chart-fullpallete-color01);
--chart-3colorspallete-option05-color01: var(--chart-fullpallete-color14);
--chart-3colorspallete-option05-color02: var(--chart-fullpallete-color01);
--chart-3colorspallete-option05-color03: var(--chart-fullpallete-color09);
--chart-4colorspallete-option01-color01: var(--chart-fullpallete-color02);
--chart-4colorspallete-option01-color02: var(--chart-fullpallete-color07);
--chart-4colorspallete-option01-color03: var(--chart-fullpallete-color12);
--chart-4colorspallete-option01-color04: var(--chart-fullpallete-color10);
--chart-4colorspallete-option02-color01: var(--chart-fullpallete-color01);
--chart-4colorspallete-option02-color02: var(--chart-fullpallete-color14);
--chart-4colorspallete-option02-color03: var(--chart-fullpallete-color09);
--chart-4colorspallete-option02-color04: var(--chart-fullpallete-color13);
--chart-4colorspallete-option03-color01: var(--chart-fullpallete-color09);
--chart-4colorspallete-option03-color02: var(--chart-fullpallete-color14);
--chart-4colorspallete-option03-color03: var(--chart-fullpallete-color10);
--chart-4colorspallete-option03-color04: var(--chart-fullpallete-color02);
--chart-5colorspallete-option01-color01: var(--chart-fullpallete-color01);
--chart-5colorspallete-option01-color02: var(--chart-fullpallete-color06);
--chart-5colorspallete-option01-color03: var(--chart-fullpallete-color11);
--chart-5colorspallete-option01-color04: var(--chart-fullpallete-color02);
--chart-5colorspallete-option01-color05: var(--chart-fullpallete-color12);
--chart-5colorspallete-option02-color01: var(--chart-fullpallete-color14);
--chart-5colorspallete-option02-color02: var(--chart-fullpallete-color09);
--chart-5colorspallete-option02-color03: var(--chart-fullpallete-color02);
--chart-5colorspallete-option02-color04: var(--chart-fullpallete-color12);
--chart-5colorspallete-option02-color05: var(--chart-fullpallete-color10);
--chart-monochromaticpallete-teal01: var(--teal-100);
--chart-monochromaticpallete-teal02: var(--teal-200);
--chart-monochromaticpallete-teal03: var(--teal-300);
--chart-monochromaticpallete-teal04: var(--teal-400);
--chart-monochromaticpallete-teal05: var(--teal-500);
--chart-monochromaticpallete-teal06: var(--teal-600);
--chart-monochromaticpallete-teal07: var(--teal-700);
--chart-monochromaticpallete-teal08: var(--teal-800);
--chart-monochromaticpallete-teal09: var(--teal-900);
--chart-monochromaticpallete-teal10: var(--teal-1000);
--chart-monochromaticpallete-indigo01: var(--indigo-100);
--chart-monochromaticpallete-indigo02: var(--indigo-200);
--chart-monochromaticpallete-indigo03: var(--indigo-300);
--chart-monochromaticpallete-indigo04: var(--indigo-400);
--chart-monochromaticpallete-indigo05: var(--indigo-500);
--chart-monochromaticpallete-indigo06: var(--indigo-600);
--chart-monochromaticpallete-indigo07: var(--indigo-700);
--chart-monochromaticpallete-indigo08: var(--indigo-800);
--chart-monochromaticpallete-indigo09: var(--indigo-900);
--chart-monochromaticpallete-indigo10: var(--indigo-1000);
--chart-monochromaticpallete-purple01: var(--purple-100);
--chart-monochromaticpallete-purple02: var(--purple-200);
--chart-monochromaticpallete-purple03: var(--purple-300);
--chart-monochromaticpallete-purple04: var(--purple-400);
--chart-monochromaticpallete-purple05: var(--purple-500);
--chart-monochromaticpallete-purple06: var(--purple-600);
--chart-monochromaticpallete-purple07: var(--purple-700);
--chart-monochromaticpallete-purple08: var(--purple-800);
--chart-monochromaticpallete-purple09: var(--purple-900);
--chart-monochromaticpallete-purple10: var(--purple-1000);
--chart-monochromaticpallete-blue01: var(--blue-100);
--chart-monochromaticpallete-blue02: var(--blue-200);
--chart-monochromaticpallete-blue03: var(--blue-300);
--chart-monochromaticpallete-blue04: var(--blue-400);
--chart-monochromaticpallete-blue05: var(--blue-500);
--chart-monochromaticpallete-blue06: var(--blue-600);
--chart-monochromaticpallete-blue07: var(--blue-700);
--chart-monochromaticpallete-blue08: var(--blue-800);
--chart-monochromaticpallete-blue09: var(--blue-900);
--chart-monochromaticpallete-blue10: var(--blue-1000);
--chart-reversemonochromaticpallete-teal01: var(--teal-1000);
--chart-reversemonochromaticpallete-teal02: var(--teal-900);
--chart-reversemonochromaticpallete-teal03: var(--teal-800);
--chart-reversemonochromaticpallete-teal04: var(--teal-700);
--chart-reversemonochromaticpallete-teal05: var(--teal-600);
--chart-reversemonochromaticpallete-teal06: var(--teal-500);
--chart-reversemonochromaticpallete-teal07: var(--teal-400);
--chart-reversemonochromaticpallete-teal08: var(--teal-300);
--chart-reversemonochromaticpallete-teal09: var(--teal-200);
--chart-reversemonochromaticpallete-teal10: var(--teal-100);
--chart-reversemonochromaticpallete-indigo01: var(--indigo-1000);
--chart-reversemonochromaticpallete-indigo02: var(--indigo-900);
--chart-reversemonochromaticpallete-indigo03: var(--indigo-800);
--chart-reversemonochromaticpallete-indigo04: var(--indigo-700);
--chart-reversemonochromaticpallete-indigo05: var(--indigo-600);
--chart-reversemonochromaticpallete-indigo06: var(--indigo-500);
--chart-reversemonochromaticpallete-indigo07: var(--indigo-400);
--chart-reversemonochromaticpallete-indigo08: var(--indigo-300);
--chart-reversemonochromaticpallete-indigo09: var(--indigo-200);
--chart-reversemonochromaticpallete-indigo10: var(--indigo-100);
--chart-reversemonochromaticpallete-purple01: var(--purple-1000);
--chart-reversemonochromaticpallete-purple02: var(--purple-900);
--chart-reversemonochromaticpallete-purple03: var(--purple-800);
--chart-reversemonochromaticpallete-purple04: var(--purple-700);
--chart-reversemonochromaticpallete-purple05: var(--purple-600);
--chart-reversemonochromaticpallete-purple06: var(--purple-500);
--chart-reversemonochromaticpallete-purple07: var(--purple-400);
--chart-reversemonochromaticpallete-purple08: var(--purple-300);
--chart-reversemonochromaticpallete-purple09: var(--purple-200);
--chart-reversemonochromaticpallete-purple10: var(--purple-100);
--chart-reversemonochromaticpallete-red01: var(--red-1000);
--chart-reversemonochromaticpallete-red02: var(--red-900);
--chart-reversemonochromaticpallete-red03: var(--red-800);
--chart-reversemonochromaticpallete-red04: var(--red-700);
--chart-reversemonochromaticpallete-red05: var(--red-600);
--chart-reversemonochromaticpallete-red06: var(--red-500);
--chart-reversemonochromaticpallete-red07: var(--red-400);
--chart-reversemonochromaticpallete-red08: var(--red-300);
--chart-reversemonochromaticpallete-red09: var(--red-200);
--chart-reversemonochromaticpallete-red10: var(--red-100);
--chart-areapallete-color01: var(--purple-200);
--chart-areapallete-color02: var(--red-200);
--chart-areapallete-color03: var(--green-200);
--chart-areapallete-color04: var(--yellow-100);
--chart-areapallete-color05: var(--orange-200);
--chart-areapallete-color06: var(--blue-200);
--chart-areapallete-color07: var(--red-100);
--chart-areapallete-color08: var(--indigo-200);
--chart-areapallete-color09: var(--teal-200);
--chart-areapallete-color10: var(--purple-100);
--chart-areapallete-color11: var(--teal-300);
--chart-areapallete-color12: var(--red-300);
--chart-areapallete-color13: var(--pink-300);
--chart-areapallete-color14: var(--blue-300);

}

.mode-Dark{

/* Dark Mode */
--chart-alerts-critical: var(--red-500);
--chart-alerts-warning: var(--orange-300);
--chart-alerts-notice: var(--yellow-300);
--chart-alerts-normal: var(--green-400);

--chart-fullpallete-color01: var(--purple-500);
--chart-fullpallete-color02: var(--red-700);
--chart-fullpallete-color03: var(--green-500);
--chart-fullpallete-color04: var(--yellow-400);
--chart-fullpallete-color05: var(--orange-600);
--chart-fullpallete-color06: var(--blue-300);
--chart-fullpallete-color07: var(--red-300);
--chart-fullpallete-color08: var(--indigo-500);
--chart-fullpallete-color09: var(--teal-400);
--chart-fullpallete-color10: var(--purple-300);
--chart-fullpallete-color11: var(--teal-600);
--chart-fullpallete-color12: var(--red-800);
--chart-fullpallete-color13: var(--pink-400);
--chart-fullpallete-color14: var(--blue-800);
--chart-1colorpallete-option01-color01: var(--chart-fullpallete-color01);
--chart-1colorpallete-option02-color01: var(--chart-fullpallete-color08);
--chart-1colorpallete-option03-color01: var(--chart-fullpallete-color06);
--chart-1colorpallete-option04-color01: var(--chart-fullpallete-color11);

--chart-2colorspallete-option01-color01: var(--chart-fullpallete-color01);
--chart-2colorspallete-option01-color02: var(--chart-fullpallete-color09);
--chart-2colorspallete-option02-color01: var(--chart-fullpallete-color10);
--chart-2colorspallete-option02-color02: var(--chart-fullpallete-color12);
--chart-2colorspallete-option03-color01: var(--chart-fullpallete-color02);
--chart-2colorspallete-option03-color02: var(--chart-fullpallete-color12);
--chart-2colorspallete-option04-color01: var(--chart-fullpallete-color06);
--chart-2colorspallete-option04-color02: var(--chart-fullpallete-color11);
--chart-2colorspallete-option05-color01: var(--chart-fullpallete-color09);
--chart-2colorspallete-option05-color02: var(--chart-fullpallete-color14);

--chart-3colorspallete-option01-color01: var(--chart-fullpallete-color10);
--chart-3colorspallete-option01-color02: var(--chart-fullpallete-color11);
--chart-3colorspallete-option01-color03: var(--chart-fullpallete-color02);
--chart-3colorspallete-option02-color01: var(--chart-fullpallete-color02);
--chart-3colorspallete-option02-color02: var(--red-500);
--chart-3colorspallete-option02-color03: var(--chart-fullpallete-color12);
--chart-3colorspallete-option03-color01: var(--chart-fullpallete-color10);
--chart-3colorspallete-option03-color02: var(--chart-fullpallete-color11);
--chart-3colorspallete-option03-color03: var(--chart-fullpallete-color14);
--chart-3colorspallete-option04-color01: var(--chart-fullpallete-color13);
--chart-3colorspallete-option04-color02: var(--chart-fullpallete-color06);
--chart-3colorspallete-option04-color03: var(--chart-fullpallete-color01);
--chart-3colorspallete-option05-color01: var(--chart-fullpallete-color14);
--chart-3colorspallete-option05-color02: var(--chart-fullpallete-color01);
--chart-3colorspallete-option05-color03: var(--chart-fullpallete-color09);

--chart-4colorspallete-option01-color01: var(--chart-fullpallete-color02);
--chart-4colorspallete-option01-color02: var(--chart-fullpallete-color07);
--chart-4colorspallete-option01-color03: var(--chart-fullpallete-color12);
--chart-4colorspallete-option01-color04: var(--chart-fullpallete-color10);
--chart-4colorspallete-option02-color01: var(--chart-fullpallete-color01);
--chart-4colorspallete-option02-color02: var(--chart-fullpallete-color14);
--chart-4colorspallete-option02-color03: var(--chart-fullpallete-color09);
--chart-4colorspallete-option02-color04: var(--chart-fullpallete-color13);
--chart-4colorspallete-option03-color01: var(--chart-fullpallete-color09);
--chart-4colorspallete-option03-color02: var(--chart-fullpallete-color14);
--chart-4colorspallete-option03-color03: var(--chart-fullpallete-color10);
--chart-4colorspallete-option03-color04: var(--chart-fullpallete-color02);

--chart-5colorspallete-option01-color01: var(--chart-fullpallete-color01);
--chart-5colorspallete-option01-color02: var(--chart-fullpallete-color06);
--chart-5colorspallete-option01-color03: var(--chart-fullpallete-color11);
--chart-5colorspallete-option01-color04: var(--chart-fullpallete-color02);
--chart-5colorspallete-option01-color05: var(--chart-fullpallete-color12);
--chart-5colorspallete-option02-color01: var(--chart-fullpallete-color14);
--chart-5colorspallete-option02-color02: var(--chart-fullpallete-color09);
--chart-5colorspallete-option02-color03: var(--chart-fullpallete-color02);
--chart-5colorspallete-option02-color04: var(--chart-fullpallete-color12);
--chart-5colorspallete-option02-color05: var(--chart-fullpallete-color10);
--chart-monochromaticpallete-teal01: var(--teal-100);
--chart-monochromaticpallete-teal02: var(--teal-200);
--chart-monochromaticpallete-teal03: var(--teal-300);
--chart-monochromaticpallete-teal04: var(--teal-400);
--chart-monochromaticpallete-teal05: var(--teal-500);
--chart-monochromaticpallete-teal06: var(--teal-600);
--chart-monochromaticpallete-teal07: var(--teal-700);
--chart-monochromaticpallete-teal08: var(--teal-800);
--chart-monochromaticpallete-teal09: var(--teal-900);
--chart-monochromaticpallete-teal10: var(--teal-1000);
--chart-monochromaticpallete-indigo01: var(--indigo-100);
--chart-monochromaticpallete-indigo02: var(--indigo-200);
--chart-monochromaticpallete-indigo03: var(--indigo-300);
--chart-monochromaticpallete-indigo04: var(--indigo-400);
--chart-monochromaticpallete-indigo05: var(--indigo-500);
--chart-monochromaticpallete-indigo06: var(--indigo-600);
--chart-monochromaticpallete-indigo07: var(--indigo-700);
--chart-monochromaticpallete-indigo08: var(--indigo-800);
--chart-monochromaticpallete-indigo09: var(--indigo-900);
--chart-monochromaticpallete-indigo10: var(--indigo-1000);
--chart-monochromaticpallete-purple01: var(--purple-100);
--chart-monochromaticpallete-purple02: var(--purple-200);
--chart-monochromaticpallete-purple03: var(--purple-300);
--chart-monochromaticpallete-purple04: var(--purple-400);
--chart-monochromaticpallete-purple05: var(--purple-500);
--chart-monochromaticpallete-purple06: var(--purple-600);
--chart-monochromaticpallete-purple07: var(--purple-700);
--chart-monochromaticpallete-purple08: var(--purple-800);
--chart-monochromaticpallete-purple09: var(--purple-900);
--chart-monochromaticpallete-purple10: var(--purple-1000);
--chart-monochromaticpallete-blue01: var(--blue-100);
--chart-monochromaticpallete-blue02: var(--blue-200);
--chart-monochromaticpallete-blue03: var(--blue-300);
--chart-monochromaticpallete-blue04: var(--blue-400);
--chart-monochromaticpallete-blue05: var(--blue-500);
--chart-monochromaticpallete-blue06: var(--blue-600);
--chart-monochromaticpallete-blue07: var(--blue-700);
--chart-monochromaticpallete-blue08: var(--blue-800);
--chart-monochromaticpallete-blue09: var(--blue-900);
--chart-monochromaticpallete-blue10: var(--blue-1000);
--chart-reversemonochromaticpallete-teal01: var(--teal-1000);
--chart-reversemonochromaticpallete-teal02: var(--teal-900);
--chart-reversemonochromaticpallete-teal03: var(--teal-800);
--chart-reversemonochromaticpallete-teal04: var(--teal-700);
--chart-reversemonochromaticpallete-teal05: var(--teal-600);
--chart-reversemonochromaticpallete-teal06: var(--teal-500);
--chart-reversemonochromaticpallete-teal07: var(--teal-400);
--chart-reversemonochromaticpallete-teal08: var(--teal-300);
--chart-reversemonochromaticpallete-teal09: var(--teal-200);
--chart-reversemonochromaticpallete-teal10: var(--teal-100);
--chart-reversemonochromaticpallete-indigo01: var(--indigo-1000);
--chart-reversemonochromaticpallete-indigo02: var(--indigo-900);
--chart-reversemonochromaticpallete-indigo03: var(--indigo-800);
--chart-reversemonochromaticpallete-indigo04: var(--indigo-700);
--chart-reversemonochromaticpallete-indigo05: var(--indigo-600);
--chart-reversemonochromaticpallete-indigo06: var(--indigo-500);
--chart-reversemonochromaticpallete-indigo07: var(--indigo-400);
--chart-reversemonochromaticpallete-indigo08: var(--indigo-300);
--chart-reversemonochromaticpallete-indigo09: var(--indigo-200);
--chart-reversemonochromaticpallete-indigo10: var(--indigo-100);
--chart-reversemonochromaticpallete-purple01: var(--purple-1000);
--chart-reversemonochromaticpallete-purple02: var(--purple-900);
--chart-reversemonochromaticpallete-purple03: var(--purple-800);
--chart-reversemonochromaticpallete-purple04: var(--purple-700);
--chart-reversemonochromaticpallete-purple05: var(--purple-600);
--chart-reversemonochromaticpallete-purple06: var(--purple-500);
--chart-reversemonochromaticpallete-purple07: var(--purple-400);
--chart-reversemonochromaticpallete-purple08: var(--purple-300);
--chart-reversemonochromaticpallete-purple09: var(--purple-200);
--chart-reversemonochromaticpallete-purple10: var(--purple-100);
--chart-reversemonochromaticpallete-red01: var(--red-1000);
--chart-reversemonochromaticpallete-red02: var(--red-900);
--chart-reversemonochromaticpallete-red03: var(--red-800);
--chart-reversemonochromaticpallete-red04: var(--red-700);
--chart-reversemonochromaticpallete-red05: var(--red-600);
--chart-reversemonochromaticpallete-red06: var(--red-500);
--chart-reversemonochromaticpallete-red07: var(--red-400);
--chart-reversemonochromaticpallete-red08: var(--red-300);
--chart-reversemonochromaticpallete-red09: var(--red-200);
--chart-reversemonochromaticpallete-red10: var(--red-100);
--chart-areapallete-color01: var(--purple-200);
--chart-areapallete-color02: var(--red-200);
--chart-areapallete-color03: var(--green-200);
--chart-areapallete-color04: var(--yellow-100);
--chart-areapallete-color05: var(--orange-200);
--chart-areapallete-color06: var(--blue-200);
--chart-areapallete-color07: var(--red-100);
--chart-areapallete-color08: var(--indigo-200);
--chart-areapallete-color09: var(--teal-200);
--chart-areapallete-color10: var(--purple-100);
--chart-areapallete-color11: var(--teal-300);
--chart-areapallete-color12: var(--red-300);
--chart-areapallete-color13: var(--pink-300);
--chart-areapallete-color14: var(--blue-300);

}/* a {
  text-decoration: none !important;
  color: var(--card-popup-blk-color);
} */
.logoUnit {
  margin-bottom: 18px;
  height: 56px;
  display: flex;
  align-items: center;
  color:var(--content-contentbase);
  margin-left: 10px !important;
  cursor: pointer;

}
.wd-100p{
  width: 100% !important;
}
.rq-acc-btn{
   background: none !important;
   border: none !important; 
   padding: 0 !important; 
   width: 100% !important; 
   text-align: left !important; 
   cursor: pointer !important; 
}
.borderRadius-0 {
  border-radius: 0px !important;
}
.sidebar-link-list-wd {
  width: 230px;
  transition: width 0.2s;
}
 
.sidebar-link-list-wd-auto{
  width: 68px;
  transition: width 0.2s;
}
.sidebar-link-list-hgt{
  height: calc(100vh - 200px);
}

.sidebar-menu-link-dark {
  color: var(--base-white) !important;
  text-decoration: none;
}
.sidebar-menu-link-light {
  color: var(--MenuBackgroundDark) !important;
  text-decoration: none;
}
.sidebar-bottom-gap{
  display: flex;
  gap: 7%;
  cursor: pointer;
  color: var(--content-contentbase) !important;
  align-items: center ;
  font-weight: var(--font-weight-300);
}
.help-center-menu:active {
    background: var(--dropdown-hover) !important;
    border-radius: 8px;
}
.help-center-menu:hover{
  color: var(--content-link) !important;background: none !important

}
.sidebar-ce-0 {
  padding: 11px 25px;
  font-size: 16px;
}
.sidebar-coll-pl{
  padding-left: 24px !important;
}
.sidebar-ce-1 {
  padding: 10px 23px;
}
.sidebar-hr-mr{
margin: 2px auto;
border-color: var(--border-borderbase);
}
.sidebar-hr-wd-expand {
  width: 88%;
}
.sidebar-hr-wd-collapse {
  width: 60%;
}
.padding-24p {
  padding: 24px !important;
}

.mainLayout {
  display: flex;
  flex-direction: column;
  height: 100vh
}
.sideBarAndMainSectionFlex {
  display: flex;
  flex: 1 1 auto;
  overflow: hidden
}
.mainLayoutBgColor {
  flex: 1 1 auto;
  overflow-Y: auto;
  background-color: var(--background-bgbase)
}


footer a,
footer h6,
footer p {
  color: var(--white-color) !important;
}

.boldText {
  font-weight: var(--font-weight-500);
}

.boldTextProcessHeader {
  font-weight: var(--font-weight-500);
  font-size: 1.8rem;
}

.processTextSpacing {
  margin: 0 10px;
}

.processTextSpacingHeading {
  margin: 0 10px 10px 10px;
}

.processTextSpacingInner {
  margin: 0 5px;
}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root:hover, .active-sidebar-items .active .custom-sidebar-nav-item{color: var(--content-link) !important;background: none !important;}
a.MuiButtonBase-root.MuiListItemButton-root{
  font-weight: var(--font-weight-300);
}
.item-list-btn{
  padding:3px !important
}

.MuiCheckbox-colorPrimary {
  color: var(--active-primary-color) !important;

}

.MuiCheckbox-root {
  border-radius: 3px !important;
}

.tableCellBlue {
  color: var(--table-cell-text-color);
  cursor: pointer;
}

.tableCellBlueUnderline {
  color: var(--active-primary-color) !important;
  cursor: pointer;
  text-decoration: underline;
}

li.MuiBreadcrumbs-li a:hover {
  color: var(--content-link) !important;
}

@media screen and (-webkit-min-device-pixel-ratio: 1) {
  @media only screen and (max-width: 1370px) and (min-width: 1200px) {
    .MuiTypography-body1 {
      font-size: 0.75rem;
    }
  }
}



.viz__tooltip {
  position: absolute;
  top: 0;
  width: 40%;
  padding: 1rem;
  border: 2px solid currentColor;
  min-height: 50px;
  z-index: 1000;
  background-color: var(--black-color) !important;
  color: var(--white-color);
}

.fix-width-icon {
  width: 20px !important;
}

.circularprogressabsolute {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.h6-header {
  font-size: 1.25rem;
  font-weight: var(--font-weight-500);
}

.mui-datagrid-header {
  background: var(--gradient-custom-200);
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: flex;
  flex-direction: row;
  -webkit-box-align: center;
  align-items: center;
  font-size: 2rem;
  font-weight: var(--font-weight-300) !important;
  /* line-height: 50px; */
  margin-bottom: 23px
}

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

/* Track */
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px var(--webkit-scrollbar-shadow);
  border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: var(--scroll-bar-color);
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  border-radius: 10px;
  background-color: var(--scroll-bar-color);
}

.tooltip-font {
  font-size: 12px;
}

.grid-center {
  display: grid;
  place-items: center;
}

.grid-auto {
  display: grid;
  grid-template-columns: auto auto;

}

.red-box {
  width: 16px;
  height: 16px;
  background-color: var(--critical-color);
}

.green-box {
  width: 16px;
  height: 16px;
  background-color: var(--running-color)
}

.black-box {
  width: 16px;
  height: 16px;
  background-color: var(--shutdown-color);
}

.yellow-box {
  width: 16px;
  height: 16px;
  background-color: var(--warning-color);
}

.grey-box {
  width: 16px;
  height: 16px;
  background-color: var(--could-not-poll-color);
}

.blue-box {
  width: 16px;
  height: 16px;
  background-color: var(--unreachable-color);
}

.underline {
  text-decoration: underline;
}

.gray-placeholder {
  background-color: var(--background-bgbase);
  border-radius: 10px;
  padding: 20px 25px 25px 40px;
}

.active-outlined-button {
  background-color: var(--pure-white) !important;
  border-color: var(--button-color) !important;
  color: var(--button-color) !important;
  border-radius: 5px;
  font-weight: var(--font-weight-500);
  font-size: 0.875rem;
  padding: 6px 16px;
}

.active-outlined-button .Mui-disabled {
  background-color: var(--active-primary-color-gray) !important;

}

.contained-button {
  font-weight: var(--heading-m-semibold-weight) !important;
  font-weight: 500 !important;
  font-size: var(--size-m) !important;
  line-height: 1.75 !important;
  letter-spacing: 0.02857em !important;
  /* text-transform: uppercase; */
  border-radius: var(--radius-m) !important;
  border: var(--width-xs) solid !important;
  padding: var(--space-xs) var(--space-l) !important;
  background-color: var(--primary-500) !important;
  color: var(--pure-white) !important;
  border-color: var(--primary-500) !important;
}

.contained-button.Mui-disabled {
  background-color: var(--containedButtonbgcolor) !important;
  color: var(--containedButtoncolor) !important;
}


.gray-bg-container {
  background-color: var(--gray-bg-container);
  box-shadow: 0px 1px 2px -1px var(--gray-bg-container-bx-shdw);
  border: 1px solid var(--divider, var(--gray-bg-container-bx-bdr));
  padding: var(--font-size-24);
  border-radius: 6px;
}

.title-large-semibold {
  font-size: var(--font-size-24);
  font-weight: var(--font-weight-600);
  /* color: var(--primary-text); */
}

.title-small-strong {
  font-size: var(--size-m) !important;
  font-weight: var(--font-weight-600) !important;
  color: var(--content-contentbase) !important;
  padding-top:5px;
}

.field-label {
  font-size: 16px;
  font-weight: var(--font-weight-500);
  color: var(--secondary-text);
}

.back-arrow {
  color: var(--active-primary-color);
  cursor: pointer;
}

input[type="checkbox"] {
  accent-color: var(--checked-primary-color);
}

.Mui-checked {
  color: var(--checked-primary-color) !important;
}

.card-title {
  font-size: 18px;
  font-weight: var(--font-weight-600);
}

.p-lr-5 {
  padding: 0 5px;
}

.grid-3-repeat {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.frequencysetmargin {
  margin-bottom: 30px;
  display: flex;
  margin-top: 6px;
  gap: 5px;
  flex-direction: column;
}

.background-color-button {
  background-color: var(--button-color) !important;
}

.background-color-button-border {
  border: 1px solid var(--button-color) !important;
  color: var(--button-color) !important;
}

.card-popup-data-value {
  font-family: var(--main-font-family) !important;
  font-weight: 400 !important;
  font-size: 0.875rem !important;
  line-height: 0.8 !important;
  letter-spacing: 0.01071em !important;
  padding: 8px !important;
  color: var(--card-popup-blk-color) !important;
}

.nowrap-text {
  text-wrap: nowrap;
}

/* to override a property declared with !important, give a selector with a higher specificity
*/
/* div .MuiTreeItem-content.Mui-selected {
  background-color: var(--primary-color) !important;
  color: white !important;
} */

.MuiTab-root.Mui-selected {
  color: var(--active-primary-color) !important;
}

.MuiBreadcrumbs-root {
  border-bottom: 1px solid var(--border-borderbase);
}
.MuiBreadcrumbs-li a {
  color: var(--content-contentsecondary) !important;
  text-decoration: none !important;
}
.MuiBreadcrumbs-li p{
  font-weight: var(--font-weight-500) !important;
  color: var(--content-contentbase) !important;
}

.disabled-class-button-none {
  display: none !important;
}

.custom-textfield .MuiOutlinedInput-root .MuiOutlinedInput-notchedOutline {
  border-color: var(--active-primary-color) !important;
}

.MuiTextField-root.MuiInputLabel-root {
  color: var(--active-primary-color) !important;
}

.custom-textfield .Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: var(--active-primary-color) !important;
}

.custom-textfield .MuiInputLabel-root {
  color: var(--active-primary-color) !important;
}

.MuiTextField-root.MuiInputLabel-root {
  color: var(--active-primary-color) !important;
}

.custom-textfield .Mui-focused .MuiInputLabel-root {
  color: var(--active-primary-color) !important;
}

.custom-textfield .Mui-error .MuiOutlinedInput-notchedOutline {
  border-color: var(--custom-textfield-bdr-color) !important;
  /* Example for error state */
}

.MuiTabs-indicator {
  background-color: var(--active-primary-color) !important;
}

.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: var(--active-primary-color) !important;
}

.MuiFormLabel-root.Mui-focused {
  color: var(--active-primary-color) 
  /* !important; */
}

.MuiButtonBase-root-MuiToggleButton-root.Mui-selected {
  background-color: var(--button-color) !important;
  color: var(--pure-white) !important;
}

.MuiSwitch-root .Mui-checked+.MuiSwitch-track {
  background-color: var(--button-color) !important;
}

.MuiSwitch-root .MuiSwitch-switchBase {
  color: var(--button-color) !important;
}

.primaryColor {
  color: var(--active-primary-color) !important;
}

.MuiSwitch-root .Mui-checked {
  color: var(--button-color) !important;
}

.MuiButtonBase-root-MuiPickersDay-root.Mui-selected {
  background-color: var(--active-primary-color) !important;
}

.selectedHost {
  color: var(--active-primary-color) !important;
}

.MuiChip-root .MuiChip-deleteIcon {
  color: var(--pure-white) !important;
}

.MuiChip-root .MuiChip-avatar {
  background-color: var(--pure-white) !important;
  color: var(--active-primary-color) !important;
}

/* .MuiDataGrid-cellContent{
  color: var(--active-primary-color)!important;
} */

/* .MuiDataGrid-withBorderColor{
  color: var(--active-primary-color)!important;
} */
.metrictype-box {
  font-size: 1rem;
  border: 1px solid var(--border-borderbase);
  margin-right: 8px;
  margin-top: 16px;
  padding: 1px 8px;
  border-radius: 3.2px;
  min-height: 20px;
  font-weight: 500
}

.no-data-msg {
  margin-top: 200px;
  text-align: center;
  width: 100%;
}

.mrdialogaction {
  margin-right: 25px;
}

.alignbase {
  align-items: baseline;
}

.ran-severity-legends-heading {
  color: var(--others-color) !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 36px !important;
}

.ran-severity-heading-value {
  color: var(--others-color) !important;
  font-size: 14px !important;
  font-style: normal !important;
  font-weight: var(--font-weight-500) !important;
  line-height: 30px !important;
}

.mapboxgl-ctrl-logo {
  display: none !important;
}

.mapboxgl-ctrl-bottom-right {
  display: none !important;
}

.table-title {
  font-size: var(--font-size-16) !important;
  font-weight: var(--font-weight-500) !important;
  color: var(--content-contentbase) !important;
}

.lastsnapshot {
  color: var(--content-contentbase) !important;
  font-family: var(--main-font-family);
  font-weight: var(--font-weight-500);
  font-size: 0.875rem;
  line-height: 1.57;
  letter-spacing: 0.00714em;
  margin-bottom: 0.35em;
  opacity: 0.87;
}

.service-monitor-container {
  max-height: calc(100vh - 150px);
}

.selectinputcommon {
  border: 1px solid var(--active-primary-color) !important;
  border-radius: 0.25em;
  padding: 0.25em 0.5em !important;
  font-size: 1rem;
  cursor: pointer;
  line-height: 1.1;
  background-color: var(--gradient-white);
  background-image: linear-gradient(to top, var(--color-bg-subtle), var(--gradient-white) 33%);
  font-family: var(--main-font-family);
  font-weight: var(--font-weight-500);
}

.titleradiobuttonthreshold {
  display: flex;
  font-size: 1rem;
  cursor: pointer;
  font-family: var(--main-font-family);
  font-weight: var(--font-weight-500);
  align-items: center;
  justify-content: end;
}

.titleradiobuttonthresholdtitle {
  display: flex;
  font-size: 1rem;
  cursor: pointer;
  font-family: var(--main-font-family);
  font-weight: var(--font-weight-400);
  align-items: center;
  justify-content: end;
}

.flex-container-threshold {
  display: flex;
  gap: 10px;
  flex-direction: row;
  /* align-items: center; */
}

.threshold-formcontrol {
  width: 20%;
  margin-right: 4%;
  margin-top: 25px;
}

.threshold-mb-mt {
  margin-bottom: 15px;
  margin-top: 10px;
}

.radio-group input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 16px;
  height: 16px;
  border: 2px solid var(--radio-group-bg-color);
  border-radius: 50%;
  outline: none;
  cursor: pointer;
  position: relative;
  margin-top: -1px;
}

.radio-group input[type="radio"]:checked::before {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: var(--checked-primary-color);
  /* Change this to your desired color */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.thresholftablewhitetitle {
  display: flex;
  justify-content: space-between;
  /* padding: 10px; */
  font-weight: var(--font-weight-600);
}

.severity-label {
  color: var(--content-contentbase) !important;
}

.delete-icon {
  /* color: var(--active-primary-color); */
  font-size: var(--font-size-40) !important;
  font-weight: var(--font-weight-500) !important;
}

.clickable-table {
  min-width: auto;
  min-height: var(--font-size-50) !important;
  cursor: pointer;
}

.simple-table {
  min-width: auto;
  min-height: var(--font-size-50) !important;
}

.highlighted-text {
  font-weight: var(--font-weight-500) !important;
  color: var(--active-primary-color) !important;
}

.bold-text {
  font-weight: var(--font-weight-500) !important;
}

.bold-text-2 {
  font-weight: var(--font-weight-500) !important;
  font-size: 1.2rem !important;
}

.custom-text {
  color: var(--secondary-text) !important;
}

.site-name {
  font-size: var(--font-size-24) !important;
  font-weight: var(--font-weight-500) !important;
  color: var(--primary-text) !important;
  padding-bottom: 18px;
}

.info-row {
  display: flex;
  align-items: center;
  padding-bottom: 10px;
}

.info-subrow {
  display: flex;
  align-items: center;
  margin-right: 16px;
  /* 2 * 8px (default spacing unit) */
}

.info-title {
  font-size: var(--size-m) !important;
  font-weight: var(--font-weight-500) !important;
  color: var(--content-contentbase) !important;
}

.info-value {
  font-size: var(--size-s) !important;
  font-weight: var(--font-weight-400) !important;
  color: var(--tab-button-color) !important;
  margin-left: 8px !important;
}

.severity-row {
  padding-bottom: var(--font-size-24) !important;
}

.severity-indicator {
  width: 12px;
  height: 12px;
  margin-right: 8px;
  /* 1 * 8px (default spacing unit) */
  margin-left: 8px;
  /* 1 * 8px (default spacing unit) */
}

.no-rows-overlay {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.no-rows-text {
  font-size: 16px;
  font-weight: var(--font-weight-500) !important;
  color: var(--secondary-text) !important;
}

.custom-color {
  color: var(--button-color) !important;
}

.custom-color-2 {
  color: var(--primary-500) !important;
}

.custom-style {
  color: var(--gradient-white) !important;
  background: var(--pure-red) !important;
  padding: 2px;
  border-radius: 2px;
}

.custom-margin-font {
  margin-bottom: 8px;
  font-weight: var(--font-weight-600) !important;
}

.custom-font-left {
  font-weight: var(--font-weight-500) !important;
  text-align: center !important;
  /* color: var(--content-notice) !important; */
  font-size: 4rem !important;
}

.custom-font-center {
  font-weight: var(--font-weight-500) !important;
  text-align: left;
  font-size: 1.2rem !important;
  color: var(--content-positive) !important;
}

.custom-font-right {
  font-weight: var(--font-weight-500) !important;
  text-align: left;
  font-size: 1.2rem !important;
  color: var(--content-negative) !important;
}

.custom-box {
  border: 1px solid var(--border-borderbase) !important;
  cursor: pointer;
  height:115px;
  padding:10px !important
}

.custom-tab {
  color: var(--content-contentbase) !important;
}

.custom-tab.Mui-selected {
  background-color: var(--button-color) !important;
  color: var(--pure-white) !important;
}

.custom-tab.Mui-selected:hover {
  background-color: var(--button-color) !important;
  color: var(--pure-white) !important;
}

.MuiStepLabel-root .Mui-active {
  color: var(--active-primary-color) !important;
}

.MuiStepLabel-root .Mui-completed {
  color: var(--active-primary-color) !important;
}

.user-info {
  margin-bottom: 16px;
  /* 2 * 8px (default spacing unit) */
}

.user-info-row {
  display: flex;
  align-items: center;
  padding-bottom: 10px;
}

.separator {
  font-size: 16px;
  font-weight: var(--font-weight-500) !important;
  color: var(--others-color) !important;
  margin: 0 16px;
  /* mx: 2 * 8px (default spacing unit) */
}

.custom-title {
  font-size: 24px;
  font-weight: var(--font-weight-500) !important;
  color: var(--others-color) !important;
  padding-bottom: 18px;
}

.custom-title-2 {
  font-size: 18px;
  font-weight: var(--font-weight-500) !important;
  color: var(--others-color) !important;
  padding-bottom: 18px;
}

.geo-custom {
  font-size: 14px;
  font-weight: var(--font-weight-400) !important;
  color: var(--primary-text) !important;
}

.geo-custom-18px {
  font-size: 18px;
  font-weight: var(--font-weight-400) !important;
  color: var(--primary-text) !important;
}

.geo-custom-20px {
  font-size: 20px;
  font-weight: var(--font-weight-400) !important;
  color: var(--primary-text) !important;
}

.geo-custom-20px-2 {
  font-size: 20px;
  font-weight: var(--font-weight-500) !important;
  color: var(--role-info-value-color) !important;
}

.geo-custom-bold {
  font-size: 28px;
  font-weight: var(--font-weight-600) !important;
}


.geo-custom-2 {
  font-size: 14px;
  font-weight: var(--font-weight-500) !important;
  color: var(--primary-text) !important;
}

.geo-custom-end {
  font-size: 14px;
  font-weight: var(--font-weight-500) !important;
  color: var(--primary-text) !important;
  text-align: end;
}

.geo-site-name {
  font-size: 24px;
  font-weight: var(--font-weight-500) !important;
  color: var(--primary-text) !important;
  padding-bottom: 4px;
}

/* .MuiGrid-item{
  border-radius: 20px;
} */

.custom-Table-font {
  font-weight: 500;
  font-size: 16px;
}

.custom-Table-style {
  font-size: 14px !important;
  /* Adjust font size for standard density */
  font-weight: var(--font-weight-500) !important;
  color: var(--primary-text) !important;
  vertical-align: top !important;
}

.custom-Table-box-style {
  font-size: var(--font-size-16);
  font-weight: var(--font-weight-500);
  color: var(--role-info-value-color);
}

.primary-searchbar-height {
  min-height: 55px !important;
}

.custom-sidebar-nav-item{
  color: var(--content-contentbase) !important;
  font-weight: var(--font-weight-300) ;
}

.custom-sidebar-nav-item-collapse {
  color: var(--content-contentbase) !important;
  margin-left: -5px;
}

.custom-left-margin-color {
  margin-left: 10px;
  color: var(--active-primary-color) !important;
}

.recharts-legend-item-text {
  cursor: pointer;
  color: var(--content-contentsecondary) !important;
}

.flex-container-threshold-email-ticket {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-right: 10px;
}

.MuiPickersDay-root.Mui-selected {
  background-color: var(--active-primary-color) !important;
}

.MuiClockNumber-root.Mui-selected {
  background-color: var(--active-primary-color) !important;
}

.MuiClockPointer-root {
  background-color: var(--active-primary-color) !important;
}

.MuiClock-pin {
  background-color: var(--active-primary-color) !important;
}
.MuiClockPointer-root.Mui-selected  {
  background-color: var(--active-primary-color) !important;
}

.MuiClock-pin {
  background-color: var(--active-primary-color) !important;
}
.hearder-notification{
  color:var(--content-contentsecondary);
  font-size: 2rem;
}
.avatar-profile-img{
  color:var(--content-contentsecondary) !important;
  width:20px !important;
  height:20px !important;
  background-color: transparent !important;
  border: 2.6px solid var(--content-contentsecondary) !important
}

.menu-toggle{display: inline-flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  position: absolute;
  left:110%;
  top:-6px;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  background-color: transparent;
  outline: 0px;
  border: 0px;
  margin: 0px 16px 0px -12px;
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  text-decoration: none;
  text-align: center;
  flex: 0 0 auto;
  border-radius: 50%;
  box-shadow:none;
  overflow: visible;
  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
  color: inherit;
  padding: 12px;
  font-size: 1.75rem;}

.menu-position{
  left:120% !important;
}
.toggle-icon-transform{
  transform:scale(-1)
}

.btn-outline-primary {
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-box-pack: center;
  position: relative;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent !important;
  background-color: transparent !important;
  outline: 0px;
  margin: 0px;
  cursor: pointer;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  text-decoration: none;
  font-weight: var(--font-weight-500) !important;
  font-size: var(--size-m) !important;
  line-height: 1.75 !important;
  letter-spacing: 0.02857em !important;
  /* text-transform: uppercase; */
  border-radius: var(--radius-m) !important;
  border: var(--width-xs) solid !important;
  padding:var(--space-xs) var(--space-l) !important;
  justify-content: center !important;
  align-items: center !important;
  /* gap: var(--space-s) !important; */
  text-transform: none !important;
  box-shadow: none !important;
  color: var(--button-button) !important;
  border-color: var(--button-buttonborder) !important;
  height:36px
}
.btn-outline-primary-filled {
  color: var(--selected-button-text) !important;
  background: var(--button-button) !important;
  cursor: pointer;
  font-weight: var(--font-weight-500) !important;
  font-size: var(--size-m) !important;
  line-height: 1.75 !important;
  letter-spacing: 0.02857em !important;
  border-radius: var(--radius-m) !important;
  padding: var(--space-xs) var(--space-l) !important;
  text-transform: none !important;
  height:36px
}
.btn-outline-primary-filled.Mui-disabled {
  background-color: var(--content-disabled) !important;
  color: var(--containedButtoncolor) !important;
}
.drawer-btn-fs{
  font-size: 1rem !important;
  padding: var(--space-s) var(--space-l) !important;
}

.btn-disabled-bg-color{
  background-color: var(--content-disabled) !important;
  cursor: default !important;
  display: inline-flex;
  -webkit-box-align: center;
  -webkit-box-pack: center;
  position: relative;
  box-sizing: border-box;
  outline: 0px;
  margin: 0px;
  user-select: none;
  vertical-align: middle;
  appearance: none;
  text-decoration: none;
  font-weight: var(--font-weight-500) !important;
  font-size: var(--size-m) !important;
  line-height: 1.75 !important;
  letter-spacing: 0.02857em !important;
  border-radius: var(--radius-m) !important;
  border: none !important;
  padding: var(--space-xs) var(--space-l) !important;
  justify-content: center !important;
  align-items: center !important;
  text-transform: none !important;
  height:36px
}

.btn-outline-primary:hover {
  border-color:var(--button-buttonborder)!important;
  color:var(--button-buttoncolor)!important;
  background: var(--button-button)!important;
}
.formSelect-mg{
  width: 100% !important;
  margin-bottom: 8px !important;
  margin-top: 8px !important;
  margin-right: 8px !important;
}

.svg-color-change{
  color: var(--card-popup-blk-color) !important
}
.svg-color-change-active{
  color: black !important
}
.svg-color-link{
  color: var(--base-white) !important
}
.query-matcher-bg{
  /* margin-top: 15px; */
  /* padding:15px */

}
.add-user-grid{
  margin-top: 20px; 
  /* min-height: 400px; */
  background-color: var(--background-bgcard) !important;
  color: var(--content-contentbase) 
}
.flex-space-between-threshold{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.select-option-bgc{
  background-color: var(--subcontent-base) !important;
  color: var(--content-contentbase) !important;
}

.vhidden{
  visibility: hidden;
}
.pt-5p{
  padding-top: 5px;
}
.mt-top-Trigger{
margin-top: 3px;
margin-left: 10px;
}
.flex-space-between-threshold{
  display: flex;
  justify-content: space-between;
  padding-top: 22px;
}
.flex-space-between-threshold-Trigger{
  display: flex;
  justify-content: space-between;
  gap:15px;
}

.alert-view-cards {
  min-width: 250px;
  text-align: center;
  color: var(--base-white) !important;
  background-color: var(--content-info) !important;  
}
.nodes-vm-overview {
  display: flex;
  gap: 20px
}
.header-bg-color-boxshadow {
  background-color: var(--background-base) !important;
  height: 64px !important;
  box-shadow: none !important;
  border-bottom: var(--width-xs) solid var(--border-bordercustom);
}
.display-box-flex-crd{
  display: flex;
 justify-content: space-between;
 padding: 0px 40px 0px 0px !important;
}
.graph-bg-color{
  color: var(--content-contentbase) !important;
}
.left-side-bar-list {
  overflow-y: auto;
  height: calc(100vh - 265px);
  padding-left: 8px !important;
  overflow-x: hidden;
  margin-top: 14px !important;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.scroll-wd-none{
  scrollbar-width: none !important;
}
.accordian-font-typo{
  font-size: var(--size-l) !important;
  font-weight: var(--font-weight-500) !important;
 
}
.mtable-wd-100{
  width: 100%; 
  overflow: auto;
}
.height-tab-230p{
  height: 230px !important;
}
 .height-tab-400p{
  height: 400px !important;
}
.height-tab-auto{
  height: auto !important;
}
.height-tab-140p{
  height: 140px !important;
}

.typo-p-mr{
 font-weight: var(--font-weight-400) !important;
 margin-bottom: 2px;
}
.sticky-vm-details{
  position: sticky;
  top: 60px;
  z-index: 1000;
}
.sticky-vm-details{
  position: sticky !important;
  top: 60px !important;
  opacity: 1;
  z-index: 1000 !important;
}
.app-on-vm{
  position: sticky !important;
  top: 118px !important;
  opacity: 1;
  z-index: 1000 !important;
}

/* .theme-button,.language-button,.scale-button, .cart-menu,.notification-button, .help-button {display: -webkit-inline-box;display: inline-flex} */
/* .theme-button,.cart-menu{padding:0.75rem!important} */
.small_scale .theme-button,.small_scale .cart-menu{padding:0.8rem!important}
.middle_scale .theme-button,.middle_scale .cart-menu{padding:0.6rem!important}
.large_scale .theme-button,.large_scale .cart-menu{padding:0.55rem!important}
.theme-button-icon {stroke: currentColor;cursor: pointer;-webkit-transition: opacity 250ms;transition: opacity 250ms;transition-timing-function: ease-out;font-size: var(--body-2);width: 24px!important;
  height: 24px!important;
  margin-bottom: -3px;}
.theme-button-icon svg{width:32px; height:32px}
.theme-button-icon path{fill: currentColor;}
.theme-button-icon line,.theme-button-icon circle {stroke: currentColor;}
.theme-button-icon path {-webkit-transition: -webkit-transform 250ms;transition: transform 250ms;transform-origin: center;transition-timing-function: ease-out;}
.dark-mode .theme-button-icon {opacity: 0.8;-webkit-transition: opacity 250ms;transition: opacity 250ms;transition-timing-function: ease-out;}
.dark-mode .theme-button-icon path {-webkit-transform: rotate(0.5turn) translate(3%, 3%);-moz-transform: rotate(0.5turn) translate(3%, 3%);-ms-transform: rotate(0.5turn) translate(3%, 3%);transform: rotate(0.5turn) translate(3%, 3%);transform-origin: center;-webkit-transition: -webkit-transform 250ms;transition: transform 250ms;transition-timing-function: ease-out;}
.dark-mode .theme-button-icon line {stroke-linecap: butt;}

.delete-icon-fnse{
  font-size: 25PX !important;
}
.justify-content-end{
  justify-content: end !important;
}
.gap-5p{
  gap: 5px;
}
.dialog-popup-head{
  margin:0 !important;
  font-size: 24px !important;
  display:flex;
  align-items: center;
}
.popup-message{
  border-bottom: 1px solid var(--border-borderbase);
  font-size: 1.0937rem
}
.justiify-end{
  justify-content: end !important;
}
.pr-12p{
  padding-right: 12px;
}
.dialog-content-pd{
  padding: 14px 0px 8px 0px !important;
}
.position-abs-rt{
  position: absolute;
  right: 4%;

}
.alert-view-color{
  color: var(--base-white) !important;
  width: 100%
}
.max-comment-p{
  padding-top: 5px;
  text-align: right;
  font-size: 0.8rem;
  color: var(--content-contentsecondary) !important;
  font-weight: var(--font-weight-400) !important;
}

.link-color-table{
  cursor: pointer;
   color: var(--content-link)

}
.p-md-4{
  padding: 1.5rem !important;
}
.position-abs-btm{
  position: absolute;
  z-index: 10;
  bottom: 0;
  right:0;
  padding: 10px 24px !important;
  border-top: 1px solid var(--border-borderbase) !important;
  background-color: var(--background-base) !important;
}
.drawer-head-title{
    background: var(--background-base) !important;
    color: var(--content-contentbase);
    font-weight: 500;
    font-size: 1.25rem;
    line-height: 1.6;
    letter-spacing: 0.0075em;
    padding: 16px 24px;
    flex: 0 0 auto;
    border-bottom: var(--width-xs) solid var(--border-borderbase);
    position: sticky;
    top: 0;
    z-index:10
}
.drawer-body-height{
  height: 80vh !important;
  overflow: auto !important;
}
.search-btn-align{
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

ul.MuiList-root  > .active-sidebar-items{
  background: var(--dropdown-hover) !important;
  border-radius: 8px;
  width: 97%;
}
.selected-icon-bgcolor{
  background-color: var(--dropdown-hover) !important;
  border-radius: 8px;
  width:85%
}
.dashboard-filer-icon {
display: flex;
justify-content: space-between;
margin-bottom: var(--space-l);
align-items: center;
padding-top: 16px;
}
.card-container-nodes{
    padding: var(--space-l);
    background-color: var(--background-bgcard);
    border-radius: var(--radius-l);
    border: var(--width-xs) solid var(--border-bordercustom);
    height: 85px;
}
.close-icon-button {
  position: absolute !important;
  right: 8px !important;
  top: 6px !important;
 cursor: pointer;
}
.cred-password-visibility{
    position: absolute;
    top: 20px;
    right:16px
}
.form-password-visible-icon {
  position: absolute;
  top: 11px;
  right: 10px;
  cursor: pointer;
}
/* .form-bgcolor-light {
  background-color: var(--background-light) !important;
  width: 90% !important;
  margin: auto;
} */

.ellipsis-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100%;
}
.content-center-btn{
  justify-content: center !important;
  align-items: center !important;
  display: flex !important;
  padding-top:24px;
  margin-top: 15px;
  border-top: 1px solid var(--border-borderbase);

}
.borderRadius-paper-12p{
  border-radius: 12px !important;
  border: 1px solid var(--border-bordercustom);
}
.footer-page-pd{
  position: sticky;
  top: 100%;  
  left: 0;
  right: 0;
  background-color: var(--background-base);
  color: var(--content-contentbase);
  padding: 10px 0px;
  border-top: 1px solid var(--border-borderbase);
}

.manage-node-popup-card{
  padding: 12px;
  background-color: var(--background-bgcard);
  border-radius: var(--radius-s);
  border: 1px solid var(--border-borderbase);
  height: 165px;
  
}

.manage-node-popup-card p{
  height: 60px;
  text-overflow: ellipsis;
}

.box-allside-pd{
padding: 16px 24px
}

.flex-grow-on {
  flex-grow: 1;
  overflow: hidden;
}
.filterbox-grow-width{
  width:240px !important;
  border:1px solid var(--border-borderbase);
  background-color: var(--background-bgcard) !important;
  transition: width 0.1s ease;
  border-radius: 0px 8px 8px 0px;
  position:relative;
  left:-25px;
  height:688px !important;
}
.filterbox-grow-width-hide{
  width: 0px !important;
   /* transition: width 0.1s ease; */
}
.filterwrapper-header-title{
  padding:10px 16px
}
.filterwrapper-flex-gap{
  display: flex;
}
.filterwrapper-body-height{
  height: 500px !important;
  overflow: auto !important;
}
.filterwrapper-action-btns{
  position:absolute;
  bottom: 0px;
  left: 0px;
  z-index: 2;
}
.cross-icon-color{
  font-size: 18px;
}
.gray-bottom-border {
    border-bottom: 1px solid var(--border-borderbase)    
}
.gray-top-border {
    border-top: 1px solid var(--border-borderbase)    
}
.iconButton-padding{
  padding: 12px 12px !important;
}
.chips-container-pd{
  background: var(--background-bgcard) !important;
  padding: 2px 10px !important;
  display:flex !important;
  align-items: center !important;
  border-top: 1px solid var(--border-borderbase) !important;
  border-left: 1px solid var(--border-borderbase) !important;
  border-right: 1px solid var(--border-borderbase) !important;
}

.common-summary-title{
  font-size: 16px !important;
  font-weight: var(--font-weight-600) !important;
  color: var(--content-contentbase) !important;
  padding-bottom: 8px !important;
}
.common-summary-subtitle{
  font-size: 16px !important;
  font-weight: var(--font-weight-400) !important;
  color: var(--content-contentsecondary) !important;
  word-break: break-word;
}
.custom-chart-tooltipBox{
  background: var(--background-bgcard) !important;
  border: 1px solid var(--border-borderbase) !important;
  padding: 0px 10px !important;
  border-radius: 8px !important;
  box-shadow: 0px 2px 6px rgba(75, 82, 92, 0.5) !important;
}
.chart-heading-title-style{
     margin: 0;
    font-size: var(--size-xl);
    line-height: 1.6;
    margin-bottom: var(--size-xl);
    color: var(--content-contentbase);
    font-weight: var(--font-weight-500);
}
.positioning-breadcrumbs-element{
    position: relative;
    bottom: 25px;
    left: -23px;
    width: 102.6%
}
.capatilize-head-title{
  text-transform: capitalize !important;
}
.border-top-line{
  border-top: 1px solid var(--border-borderbase) !important;
}
.form-card-header{
  font-size: var(--size-2xl) !important;
  font-weight: var(--font-weight-600) !important;
  color: var(--content-contentbase) !important;
}
.delete-query-matcher{
  position: absolute;
  right: 24px;
  top: 16px; 
}
.position-search-icon{
  position: absolute;
  right: 20px;
  top: 12px; 
  color: var(--content-contentsecondary) !important;
}
.mandatory-label-color{
  color: red !important;
}

/* Start Common CSS */
.py-2{
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}
.justify-content-space-around {
  justify-content: space-around !important;
}

.minwidth-auto{
  min-width: auto !important;
}

.MuiList-root.scroll-wd-none ul > div > .MuiButtonBase-root.MuiListItemButton-root{padding: 0 !important;display: flex;align-items: center;justify-content: center;}

ul.MuiList-root .MuiListItemIcon-root svg{width: 38px;}
.MuiDataGrid-virtualScroller{height:auto; overflow: hidden !important;}
.MuiDataGrid-overlayWrapper{height: 52px !important}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root{margin-left: 0 !important;margin-right: 0 !important;gap: 14px;padding: 11px;}
.fontSize24{font-size: 1.65rem !important;}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root:hover .custom-sidebar-nav-item{color: var(--content-link) !important;}
.scroll-wd-none .MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root{width: 47.6px;display: flex;align-items: center;justify-content: center;}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root{    min-width: initial !important; display: flex; align-items: center;justify-content: center;}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root .myicons{font-size: 18px !important;}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root .myicons.analyzer{font-size: 18px !important;}
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root .myicons.logs, 
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root .myicons.maintenance-windows, 
.MuiList-root .MuiButtonBase-root.MuiListItemButton-root .MuiListItemIcon-root .myicons.nodes{font-size: 14px !important;}
.sidebar-bottomLinks{padding: 17px 0; border-top: 1px solid var(--border-borderbase);}
.mainButtonHive{display: flex;align-items: center;justify-content: center; position:relative}
.MuiIconButton-root{color: var(--content-contentsecondary) !important;}
.MuiChip-root{
  background: var(--background-formfield) !important;
  color:var(--content-link) !important;
  height:30px !important;
  border-radius: 8px !important;
}
.MuiChip-deleteIcon{
  color: var(--content-contentsecondary) !important;
  font-size: 16px !important;
}
.MuiChip-label{
  font-size: var(--regular-l) !important;
  font-family: var(--main-font-family) !important;
}
.css-8je8zh-MuiTouchRipple-root{
  background-color: none !important;
}
.Mui-focused fieldset{
  border-width: 1px !important;
}
.search-icon-position{
  position: absolute;
  right: 16px !important;
  top: 12px !important;
  color: var(--content-contentsecondary) !important;
  cursor: pointer;
}

.MuiDataGrid-toolbarContainer .MuiInput-underline:after {
  border-bottom: none !important;
}

.MuiDataGrid-toolbarContainer .MuiInput-underline:before {
  border-bottom: none !important;
}

.MuiDataGrid-toolbarContainer .MuiInput-root {
  border:1px solid var(--border-borderbase) !important;
  border-radius: 4px !important;
  padding:2px 0px 0px 4px !important;
  background: var(--background-formfield) !important;
}
.MuiDataGrid-toolbarContainer .MuiInput-underline:hover:after {
  border-bottom: 1px solid var(--border-borderbase) !important;
}

.MuiDataGrid-toolbarContainer button[aria-label="Show filters"] {
  position: absolute !important;
  right: 300px !important;
  padding:6px !important;
  color: var(--content-contentsecondary) !important;
}
.MuiDataGrid-toolbarContainer button[aria-label="Show filters"]:hover {
  background-color: var(--background-light) !important;
}

.MuiDataGrid-toolbarContainer button[aria-label="Select columns"] {
  position: absolute !important;
  padding:6px !important;
  right: 400px !important;
  color: var(--content-contentsecondary) !important;
}
.MuiDataGrid-toolbarContainer button[aria-label="Select columns"]:hover {
  background-color: var(--background-light) !important;
}

.myicons-fs18{
  font-size: 24px !important;
  margin-top: 3px !important;
  display: inline-block
}

.myicons-background-filled{
 background: var(--background-light);
    width: 30px;
    height: 30px;
    font-size: 20px;
    padding: 6px;
    border-radius: 8px;
    text-align: center;
}

.myicons-gradient-filled-100{
  background: var(--gradient-custom-100);
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.myicons-gradient-filled-200{
  background: var(--gradient-custom-200);
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.card-header .fontSize24 {
position:absolute;
right:0px;
}


/* End Common CSS */