:root {
  --primary_color: #27AAE1;
}

body,
.content-wrapper {
  background-color: #f0f3f8 !important;
  font-family: Poppins;
}

body.home-page {
  background-color: #c6dace !important;
}

.btn-primary {
  background-color: var(--primary_color);
}

.main-sidebar {
  background: #ffffff;
  color: #3c3d3e;
  border: 2px solid #b8bbbf;
  box-shadow: none !important;
  border: none;

}

.sidebar .nav-link {
  color: #555;
  font-weight: 500;
  font-size: 14px;
  margin-bottom: 50px;
}
.nav-sidebar > .nav-item{
  margin-bottom: 15px;
}
.sidebar .nav-link .nav-icon{
  color: #27AAE1;
}
.nav-sidebar > .nav-item.active{
  background-color: #f0f3f8;
}

.portal.form-group{

}
.portal.form-group label{
  font-weight:  normal;
  color: #444;
  margin-bottom: 0px;
}
.portal.form-group .form-control, .portal.form-group .input-group{
  border-top: none;
  border-left: none;
  border-right: none;
  padding-left: 0px;
  border-bottom-width: 2px;
  border-bottom: 2px solid  #ced4da;
}

.portal.form-group .input-group .form-control{
  border-bottom: none;
}

.portal.form-group .input-group .icon, .portal.form-group .input-group .action{
  color: #27AAE1;
}
.portal.form-group .input-group .action{
  cursor: pointer;
}

  

.login-card{
  width:95%;
  max-width: 400px;
  border-radius: 15px;
}

.form-card{
  width:95%;
  max-width: 700px;
  border-radius: 15px;
}
.form-card h2{
  font-size: 16px;
  border-bottom: 2px solid #ddd;
  font-weight: bold;
  padding-bottom: 10px;
}

.form-card .form-group label{
  font-size: 14px;
  font-weight: 400;
}

.portal.table td, .portal.table th{
  font-size: 14px;
}
.portal.table thead tr:nth-child(1) th{
  background-color: var(--primary_color);
  white-space: nowrap;
  color: #ffffff;
  border-bottom: none;
}
.portal.table thead tr:nth-child(2) th input{
  border-radius: 5px;
  border: 1px solid #999;
  height: 33px;
}

.portal.table td.actions a{
  text-decoration: none;
  color: var(--primary_color);
  cursor: pointer;
}

.portal-view .table th{
  font-weight: 500;
  color: #333;
  font-size: 14px;
}
.portal-view .table td{
  font-weight: 400;
  color: #333;
  font-size: 14px;
}


.formError {
  font-size: 12px;
  margin-top: 0px;
  padding-top: 0px;
  color: red;
}

.form_error {

  color: red;
}



body.sidebar-collapse .nav-treeview.docs {
  margin-left: 10px;
}

body.sidebar-collapse .nav-treeview.docs a {
  font-size: 1rem;
}



.sidebar-mini.sidebar-collapse .sidebar{
  padding-left: 0px;
  padding-right: 0px;
}


.sidebar-mini.sidebar-collapse {
  width: 6.61rem !important;
}

.sidebar-mini.sidebar-collapse .main-sidebar:not(.sidebar-no-expand):hover {
  width: unset;
}


.sidebar-mini.sidebar-collapse .sidebar .nav-sidebar .nav-link {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;

}



.sidebar-mini.sidebar-collapse .sidebar .nav-sidebar .nav-link p {
  margin-left: 0px !important;
  -webkit-animation-name: none !important;
  animation-name: none !important;
  -webkit-animation-duration: .3s;
  animation-duration: .3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  visibility: visible !important;
  display: inline-block !important;
  width: unset;
  white-space: pre-wrap;
  text-align: center;
}


.nav-collapse-hide-child .menu-open>.nav-treeview {
  -webkit-animation-name: none !important;
  animation-name: none !important;
  width: unset;
}

.sidebar-collapse .sidebar:not(:hover) .nav-collapse-hide-child .menu-open>.nav-treeview {
  
  width: unset;
  -webkit-animation-name: none !important;
  animation-name: none !important;
}




.sidebar-is-opening .sidebar .nav-sidebar .nav-link p {
  -webkit-animation-name: none !important;
  animation-name: none !important;
  width: unset;
  visibility: visible !important;
  display: inline-block !important;
  width: unset;
  white-space: pre-wrap;
  text-align: center;
}

.sidebar-mini.sidebar-collapse .brand-link,
.sidebar-mini.sidebar-collapse .sidebar .nav-sidebar .nav-link {
  max-width: 6.61rem !important;
}


.content-wrappern {
  width: 98vw;
}


.content-nav {
  width: 100%;
  overflow-x: auto;
  white-space: nowrap;
}

.content-nav ul {
  display: flex;
  justify-content: space-between;
  padding: 0;
  margin: 0;
  list-style: none;
}

.content-nav .nav-item {
  flex: 1;
  text-align: center;
}

.content-nav .nav-link {
  display: block;
  padding: 16px 15px;
  color: #777;
  text-decoration: none;
  position: relative;
  font-size: 14px;
  font-weight: 500;
}

.content-nav .nav-link::after {
  content: '';
  display: block;
  width: 100%;
  height: 2px;
  background-color: #ddd;
  transition: background-color 0.3s ease;
  position: absolute;
  bottom: 0;
  left: 0;
}

.content-nav .nav-link:hover,
.content-nav .nav-link.active {
  color: #222;
  font-weight: bold;
}

.content-nav .nav-link:hover::after,
.content-nav .nav-link.active::after {
  background-color: #3a99c9;
  height: 3px;
}


/* sidebar-collapse */


.card-search{
  max-width: 450px;
  border-radius: 10px;
  box-shadow: 2px 2px 2px 1px #c0bebe;
}
.search-input-group label{
  font-weight: 400 !important;
  font-size: 14px !important;
  color: #555;
}
.search-input-group .input-group{
  border: 1px solid #c0bebe;
  border-radius: 7px;
  padding-left: 10px;
}
.search-input-group .input-group .form-control{
  border:  none !important;
 }
 .search-input-group .input-group > span{
  color: #999;
  font-size: 1.1rem;
 }