:root {
--light: #ffffff;
--sky: #40a7e2;
--dark: #222b40;
--green: #88a67e;
--blue: #1c2e9e;
--lightblue: #0f6cbd;
--blackOne: #181821;
--lightblack: #232f3e;
--lightgreen: #a1bf8f;
--brown:#F3BE95;
--gold:#F8DEB0;
--silken:#E6DAC6;
--purple: #452b90;
--red: #C6487E;

--back-color: #e8e9ec;
--primary-color: #737b8b;
--header-back: #fff;
--header-text: #737b8b;
--sidebar-back:#fff;
--sidebar-text:#737b8b;
--sidebar-text-hover:#f8b940;
}

.hedaerbar{
    background-color: var(--header-back) !important;
  color: var(--header-text);
}


.box img {
    border: 2px solid var(--primary-color);
  }

  
  .show-counter{
    color: #fff;
  }
  .nav-link i{color: #fff;}

  table.myTable>tbody>tr:hover{
    background-color: rgba(243, 246, 242, 0.5) !important;
  }
  .header-nav .nav-profile span {
    color: #702459;
  }

  .sidebar {
    background-color: var(--sidebar-back) !important;
  }
  .sidebar-nav .nav-link.collapsed{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-link.collapsed i{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-link{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-link:hover{
    color:var(--sidebar-text-hover);
  }
  .sidebar-nav .nav-content.collapse.show li:before{
    background: var(--sidebar-text-hover);
  }

  .sidebar-nav .nav-content.collapse.sub-menu.show li:before{
    background: var(--sidebar-text-hover);
  }
  .sidebar-nav .nav-content.collapse.sub-menu.show li a:after{
    border-left: 1px solid var(--sidebar-text);
  }
  .sidebar-nav .nav-link{
    color:var(--sidebar-text);
  }

  .sidebar-nav .nav-item.active .nav-link.collapsed{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-item.active .nav-link{
    color: var(--sidebar-text-hover);
  }
  .sidebar-nav .nav-item.active .nav-link.collapsed .sub-menu.collapse a{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-item.active .nav-link .sub-menu.collapse.show .nav-item a{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-content a{
    color:var(--sidebar-text);
  }
  .sidebar-nav .nav-link i{
    color:var(--sidebar-text);
  }
  /* .sub-menu .active {
    background-color:red !important; 
  } */

  .header-nav .nav-profile span{
    color: #fff;
  }

  .btn.btn-add, .btn.btn-primary {
    background-color: var(--new-primary-color);
  }


  div.paginate input[type="button"].active{
    background-color: var(--primary-color);
  }
  #paginate-go-button{
    background-color: var(--primary-color);
  }
  .new-black .tablink{
    background-color: var(--back-color);
  }
  .new-black .tablink.active, .new-black .tablink.active:before, .new-black .tablink.active:after{
   background-color: var(--primary-color);
  }
  .new-black .tablink:before, .new-black .tablink:after{
    background-color: var(--back-color);
  }

  #themeSelectColor{
    border: 1px solid var(--sidebar-text);
  }
  #languageSelect{
      color:  var(--sidebar-text);
  }
  #themeSelect{
      color:  var(--sidebar-text);
  }
  .sidebar-nav li {
    border-bottom: 1px solid #509ac4;
  }


/* div>nav{
    width: 260px !important;
    overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: #aab7cf transparent;
      box-shadow: 0 4px 25px 0 rgb(0 0 0 / 10%);
      background-color: rgb(255, 255, 255) !important;
  }
  #main div>nav{
    width: 100% !important;
  }
   */


   .ant-menu-item{
    background: var(--header-back) !important;
   }

   .ant-menu.ant-menu-dark, .ant-menu-dark .ant-menu-sub, .ant-menu.ant-menu-dark .ant-menu-sub{
    background: transparent !important;
   }

.ant-menu.ant-menu-dark, .ant-menu-dark .ant-menu-sub, .ant-menu.ant-menu-dark .ant-menu-sub {
    color: var(--black) !important;
    /* background: var(--header-back) !important; */
}
.ant-menu-submenu-title{
    color: var(--black) !important;
    background: var(--header-back) !important;
    border-top: 0 !important
}
.ant-menu-item{
    border-top: 0 !important
}
.ant-menu.ant-menu-dark .ant-menu-submenu-title .ant-menu-submenu-arrow::after, .ant-menu-dark .ant-menu-sub .ant-menu-submenu-title .ant-menu-submenu-arrow::after, .ant-menu.ant-menu-dark .ant-menu-sub .ant-menu-submenu-title .ant-menu-submenu-arrow::after, .ant-menu.ant-menu-dark .ant-menu-submenu-title .ant-menu-submenu-arrow::before, .ant-menu-dark .ant-menu-sub .ant-menu-submenu-title .ant-menu-submenu-arrow::before, .ant-menu.ant-menu-dark .ant-menu-sub .ant-menu-submenu-title .ant-menu-submenu-arrow::before{
    background: var(--black) !important;
}
.ant-menu-inline.ant-menu-root .ant-menu-item > .ant-menu-title-content, .ant-menu-inline.ant-menu-root .ant-menu-submenu-title > .ant-menu-title-content {
    color: var(--black) !important;
    height: auto;
    line-height: normal;
}

.ant-menu-dark.ant-menu-inline .ant-menu-item, .ant-menu-dark.ant-menu-inline .ant-menu-submenu-title {
    color: var(--black) !important;
    background: transparent !important;
    padding: 10px 15px;
}
.ant-menu-vertical .ant-menu-item, .ant-menu-vertical-left .ant-menu-item, .ant-menu-vertical-right .ant-menu-item, .ant-menu-inline .ant-menu-item, .ant-menu-vertical .ant-menu-submenu-title, .ant-menu-vertical-left .ant-menu-submenu-title, .ant-menu-vertical-right .ant-menu-submenu-title, .ant-menu-inline .ant-menu-submenu-title {

    white-space: normal;
    height: auto !important;
}
.ant-menu-dark .ant-menu-inline.ant-menu-sub {
  position: relative;
}

.ant-menu-sub.ant-menu-inline > .ant-menu-item, .ant-menu-sub.ant-menu-inline > .ant-menu-submenu > .ant-menu-submenu-title {
    height: auto;
    line-height: normal;
    padding: 8px 15px;
}

.ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > .ant-menu-item::before{
    /* background: #425668; */
    background: #f8b940;
    bottom: inherit;
    content: "";
    height: 10px;
    left: 46px;
    margin-top: 0;
    position: absolute;
    right: auto;
    width: 10px;
    z-index: 99;
    border-radius: 50%;
    border: 2px solid #fff;
    top: 9px;
  }
  .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > .ant-menu-item.ant-menu-item-selected::before{
    background: #de9301;
  }

  .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > .ant-menu-item.ant-menu-item-selected .ant-menu-title-content{
      color: #de9301 !important;
  }

  .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline li, .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > .ant-menu-sub.ant-menu-inline li{
    position: relative;
  }

  .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline li::before{
    background: #f8b940;
      bottom: auto;
      content: "";
      height: 10px;
      left: 24px;
      margin-top: 5px;
      position: absolute;
      right: auto;
      width: 10px;
      z-index: 99;
      border-radius: 50%;
      border: 2px solid #fff;
      top:5px;
  }
  .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline li>.ant-menu-submenu-title::after{
    border-left: 1px solid #dbd9d9;
    bottom: 0;
    content: "";
    left: 40px;
    position: absolute;
    top: 10px;
    transform: rotate(90deg);
    height: 10px;
  }

  .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline li::after{
    bottom: 0;
    content: "";
    left: 27px;
    position: absolute;
    top: -8px;
    height: 100%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  }


  /* .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > li span::after{
    border-left: 1px solid rgb(84 117 227);
    bottom: 0;
    content: "";
    left: 40px;
    position: absolute;
    top: 9px;
    transform: rotate(90deg);
    height: 10px;
  } */

  /* .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline li::after{
    bottom: 0;
      content: "";
      left: 27px;
      position: absolute;
      top: 26px;
      height: auto;
      width: 1px;
      background: #d4d4d4;
      z-index: 9;
      animation: drawline 10s linear;
  } */

  /* .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline li ul::after {
    bottom: 0;
    content: "";
    left: 50px;
    position: absolute;
    top: 0;
    height: 100%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  } */

  .sidebar ul li.ant-menu-submenu-open ul li{
    position: relative;
  }
  .sidebar ul li.ant-menu-submenu-open ul li::after{
    bottom: 0;
    content: "";
    left: 27px;
    position: absolute;
    top: -8px;
    height: 167%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  }
  /* .sidebar ul li.ant-menu-submenu-open ul li:last-child::after{
    content: "";
    display: none;
  } */

  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open{
    position: relative;
  }
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open::after{
    bottom: 0;
    content: "";
    left: 27px;
    position: absolute;
    top: -8px;
    height: 100%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  }
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open:nth-child(1):after{
    bottom: 0;
    content: "";
    left: 27px;
    position: absolute;
    top: -8px;
    height: 100%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  }



  /* .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open:last-child::after{
    content: "";
    display: none;
  } */
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li{
    position: relative;
    padding-left: 15px !important;
  }
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li::after{
    bottom: 0;
    content: "";
    left: 49px;
    position: absolute;
    top: -8px;
    height: 130%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
    transform: inherit !important;
    opacity: 1 !important;
  }

  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li:nth-child(1):after{
    bottom: 0;
    content: "";
    left: 49px;
    position: absolute;
    top: -8px;
    height: 130%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  }
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li:last-child:after{
    bottom: 0;
    content: "";
    left: 49px;
    position: absolute;
    top: -8px;
    height: 55%;
    width: 1px;
    background: #d4d4d4;
    z-index: 9;
    animation: drawline 10s linear;
  }

  /* .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li:last-child::after{
    content: "";
    display: none;
  } */
  .sidebar ul li.ant-menu-submenu-open ul li {
    border-bottom: 0 !important;
  }
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li span{
    position: relative;
    padding-left: 15px;
    margin-left: 38px;
  }
  .sidebar ul li.ant-menu-submenu-open ul li.ant-menu-submenu-open ul li span::after {
    border-left: 1px solid #dbd9d9;
    bottom: 0;
    content: "";
    left: 7px;
    position: absolute;
    top: 1px;
    transform: rotate(90deg);
    height: 10px;
    z-index: 9999;
  }




  .ant-menu-submenu.ant-menu-submenu-inline.ant-menu-submenu-open > ul > li::before{
    left: 22px !important;
  }

  .ant-menu-submenu.ant-menu-submenu-inline.ant-menu-submenu-open > ul ul > li::before{
    left:45px !important;
  }


.ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > .ant-menu-submenu-title span:after, .ant-menu-submenu-open > .ant-menu-sub.ant-menu-inline > .ant-menu-sub.ant-menu-inline > .ant-menu-item span:after {
    border-left: 1px solid rgb(84 117 227);
    bottom: 0;
    content: "";
    left: 64px;
    position: absolute;
    top: 16px;
    transform: rotate(90deg);
    height: 10px;
  }

  .show-counter{
    color: var(--header-text) !important;
  }
  .hedaerbar .bg select{
    color: var(--header-text) !important;
  }


.FaBars svg,.AiOutlineClose svg{
  color: var(--black) !important;
  fill: currentColor;
}

/* .rdt_TableHeadRow{
  background: #e0e0e0 !important;
  color: #101010;
} */

 

/* 
.btn{
  background-color: var(--primary-color) !important;
  color: var(--sidebar-back)!important;
} */

.hedaerbar .bg select.form-select option, .hedaerbar .bg select option {
  background-color: var(--back-color) !important;
}