@import url(./cssImports/dashboard/form-group.css);
@import url(./cssImports/dashboard/modal.css);
@import url(./cssImports/dashboard/custom-btn.css);
@import url(./cssImports/dashboard/navbar.css);
@import url(./cssImports/dashboard/custom-style.css);
@import url(./cssImports/dashboard/navigationbar.css);
@import url(./cssImports/dashboard/media-query.css);

body {
  background: var(--body-color) !important;
  /* color: #f7f7f7; */
}

.btn-main-dark {
  color: var(--text-mode);
  background-color: var(--mainBtn) !important;
  border-color: var(--mainBtn);
}

.btn-main-dark:hover {
  color: #fff !important;
  background-color: var(--hover-color) !important;
  border: solid 1px var(--hover-color) !important;
  border-color: var(--hover-color) !important;
}

.perpage {
  align-content: center !important;
  height: 2.2rem;
  background-color: var(--card) !important;
  border: none !important;
  padding: 0px !important;
  border-radius: 10px !important;
  text-align: center !important;
  color: var(--text-mode) !important;
  background-image: none !important;
}


input[type=search] {
  align-content: center !important;
  height: 2.2rem;
  background-color: var(--card) !important;
  border: none !important;
  padding: 0px !important;
  border-radius: 10px !important;
  text-align: center !important;
  color: var(--text-mode) !important;
  background-image: none !important;
}



.perpage option:hover {
  background-color: var(--mainBtn) !important;
}


.breadcrumb-item a {
  color: var(--main-text-color) !important;
}

.dropdown-item {
  padding-bottom: 10px !important;
  border-radius: 10px !important;
}

/*  form check toggle */
.form-check-input:hover {
  cursor: pointer !important;
}

.form-check-input:checked {
  background-color: var(--addBtn) !important;
  border-color: var(--addBtn) !important;
}

.form-check-input:focus {
  border-color: var(--addBtn) !important;
  box-shadow: none !important;
}

.login-form .form-group label {
  color: var(--mainBtn) !important;
}

.login-text-btn {
  position: relative !important;
  top: -3px !important;
}

.login-icon {
  position: relative !important;
  top: 3px !important;
}

.forget-btn .text {
  position: relative !important;
  top: -3px !important;
}

.forget-btn .mdi {
  position: relative !important;
  top: 3px !important;
}

.login-btn {
  font-size: 13px !important;
}



*::-webkit-scrollbar-track {
  background-color: transparent;
  display: none;
}

*::-webkit-scrollbar-thumb {
  background: var(--scroll-color) !important;
  border-radius: 20%;
}

*::-webkit-scrollbar {
  background: var(--scroll-bg) !important;
  width: 0.4rem;
}


.footer-item img {
  width: 1.8rem;
  cursor: pointer;
  float: right;
}

.footer-item:hover {
  transition: 0.2s;
  transform: scale(1.1);
}

.mdi {
  font-size: 25px !important;
}

.nav-link span {
  position: relative;
  top: -4px !important;
  margin: 0px 10px !important;
}

/* .nav__logo,.nav__link{
  display:grid;
  grid-template-columns: max-content max-content;
  align-items:center;
  column-gap: 1rem;
  padding:.5rem 30px .5rem 1.5rem;
} */
.nav__logo {
  margin-bottom: 2rem;
}

.nav__logo-icon {
  font-size: 1.25rem;
  color: var(--white-color);
}

.nav__logo-name {
  font-weight: 700;
  color: var(--white-color);
}

/* .nav__link{
  position:relative;
  color:var(--first-color-light);
  margin-bottom:1.5rem;
  transition:.5s;
}
.nav__link:hover{
  color:rgb(24, 24, 24);
  background:#f1f7f8 !important;
} */
.nav__icon {
  font-size: 1.25rem;
}


.body-pd {
  padding-left: calc(var(--nav-width) + 1rem);
}

.user-detail {
  border: 1px solid rgba(223, 215, 202, .75) !important;
}


.change_lang_other .flex {
  text-align: right !important;
}

.lang-link {
  margin-bottom: 10px !important;
}

.display-icon {
  width: 40px !important;
  height: 40px !important;
  background: var(--body-color) !important;
  border-radius: 50px !important;
  line-height: 1.6 !important;
  text-align: center !important;
}


.active_lang_font {
  background: var(--body-color) !important;
  color: #fff !important;
}



/* .display-icon i{
  trans
} */


/*  media query */
@import url(./cssImports/dashboard/media-query.css);