@import url('https://fonts.googleapis.com/css2?family=Karantina:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Karantina:wght@300;400;700&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
:root {

  --bs-font-sans-serif:"Montserrat", sans-serif;

  --cus-bg:#1F44A1;
  --bs-btn-bg:#1F44A1;
}

.karantina-light {
  font-family: "Karantina", system-ui;
  font-weight: 300;
  font-style: normal;
}

.karantina-regular {
  font-family: "Karantina", system-ui;
  font-weight: 400;
  font-style: normal;
}

.karantina-bold {
  font-family: "Karantina", system-ui;
  font-weight: 700;
  font-style: normal;
}
.uiBrandTitle{
  font-family: "Karantina", system-ui;
  font-weight: 400;
  font-style: normal;
  text-align: center;
}
.uiBrandBig{
  font-size:64px;
}
.uiBrandSmall{
  font-size:36px;
}

.sb-topnav {
  padding-left: 0;
  height: 84px;
  z-index: 1039;
}
.sb-topnav .navbar-brand {
  width: 225px;
  margin: 0;
}
.sb-nav-fixed #layoutSidenav #layoutSidenav_nav .sb-sidenav {
  padding-top: 84px;
}
.sb-nav-fixed #layoutSidenav #layoutSidenav_nav {
  width: 278px;
  height: 100vh;
  z-index: 1038;
}
.sb-topnav .navbar-brand {
  width: 278px !important;
  margin: 0;
}
.sb-nav-fixed #layoutSidenav #layoutSidenav_content {
  padding-left: 278px !important;
  top: 84px;
}

#layoutSidenav #layoutSidenav_nav {
  flex-basis: 278px !important;
  flex-shrink: 0;
  transition: transform 0.15s ease-in-out;
  z-index: 1038;
  transform: translateX(-278px);
}

#layoutSidenav #layoutSidenav_content {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  flex-grow: 1;
  min-height: calc(100vh - 84px);
  margin-left: -278px;
}


.sb-sidenav-blue {
  background-color: #EEEEEE;
  color: rgba(255, 255, 255, 0.5);
}
.sb-sidenav-blue .sb-sidenav-menu .sb-sidenav-menu-heading {
  color: rgba(255, 255, 255, 0.25);
}
.sb-sidenav-blue .sb-sidenav-menu .nav-link {
  color: rgba(255, 255, 255, 0.5);
}
.sb-sidenav-blue .sb-sidenav-menu .nav-link .sb-nav-link-icon {
  color: rgba(255, 255, 255, 0.25);
}
.sb-sidenav-blue .sb-sidenav-menu .nav-link .sb-sidenav-collapse-arrow {
  color: rgba(255, 255, 255, 0.25);
}
.sb-sidenav-blue .sb-sidenav-menu .nav-link:hover {
  color: #fff;
}
.sb-sidenav-blue .sb-sidenav-menu .nav-link.active {
  color: #fff;
}
.sb-sidenav-blue .sb-sidenav-menu .nav-link.active .sb-nav-link-icon {
  color: #fff;
}
.sb-sidenav-blue .sb-sidenav-footer {
  background-color: #343a40;
}
.bg-blue {
  --bs-bg-opacity: 1;
  background-color:#1F44A1 !important;
}
.sb-topnav.navbar-dark #sidebarToggle {
  color: rgba(255, 255, 255, 1);
  font-size: 36px;
}

.sb-sidenav-blue .sb-sidenav-menu .nav a.nav-link{
  
  color: #1F44A1;
  font-size: 16px;
  padding-top: 10px;
  padding-bottom:10px;
  padding-left:30px;
  margin-right:10px;
  border-top-right-radius: 10px; /* Top-right corner */
  border-bottom-right-radius: 10px; /* Bottom-right corner */ 

}
.sb-sidenav-menu{
  padding-top:10px;
}
.sb-sidenav-blue .sb-sidenav-menu .nav a.nav-link:hover {
 
  border-top-right-radius: 10px; 
  border-bottom-right-radius: 10px; 
  background-color: #C2CADC;
 
}

.mw-subinterface-header-route{
  vertical-align: middle;
  min-height:60px;
  line-height:40px;

}
.mw-subinterface-header-route .route-elem{
  vertical-align: middle;

}
.mw-subinterface-header-route .route-title{
  vertical-align: middle;
  font-size:16px;

}

.mw-subinterface-header-route .route-sep{
  padding-left: 7px;
  padding-right:7px;
  font-size:16px;
  margin-bottom:11px;
  vertical-align: bottom;


  

}


.mw-subinterface-header-route .route-last{
  font-weight:bold;
}
.mw-subinterface-header-route .route-elem-single{
  
}
.mw-subinterface-header-route .route-elem-single .route-title{
 font-size:28px;

}
.mw-subinterface-header-route .route-uiicon{
 
  padding-right:10px;
  font-size:40px;
  vertical-align: middle;

}




.card-cush1 > .card-header{
  background-color: var(--cus-bg);
  font-size:36px;
  text-align:center;
  color: #ffffff;
  font-weight: 700;
}

.frmDataTitle{
  font-size:32px;
  font-weight: 700;
}
.mw-subinterface-btns-container{
  text-align: center;
  padding-top:20px;
  padding-bottom:20px;
}
.mw-subinterface-btns-container .btn{
  border-radius:18px;
  font-size:24px;
  font-weight:700px;
  color: #fff;
  /*
  background-color: var(--cus-bg);
  */
}
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--cus-bg);
  --bs-btn-border-color: var(--cus-bg);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--cus-bg);
  --bs-btn-hover-border-color: var(--cus-bg);
  --bs-btn-focus-shadow-rgb: 49, 132, 253;
  --bs-btn-active-color:var(--cus-bg);
  --bs-btn-active-bg: var(--cus-bg);
  --bs-btn-active-border-color: #000;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #0d6efd;
  --bs-btn-disabled-border-color: #0d6efd;
}
.btn-default {
    --bs-btn-bg: var(--cus-bg);
}

.status-container {
  display: flex;
  gap: 20px;
  margin: 20px;
  justify-content: center; 
   flex-wrap: wrap; 
}

.status-card {
  position: relative;
  width: 200px;
  text-align: center;
  border: 3px solid;
  border-radius: 8px;
  padding: 10px 0;
 
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

.status-card .status-title {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: white;
  padding: 0 6px;
  font-size: 12px;
  color: #666;
  letter-spacing: 0.5px;
  font-weight: bold;        
  text-transform: uppercase; 
  z-index: 1;

}

.status-card .status-count {
  font-size: 50px;
  font-style: italic;
  font-weight: 900;   
  margin: 5px 0;
}

.status-card .status-label {
  font-size: 16px;
   font-weight: 600; 
}

/* Color classes */
.status-blue {
  border-color: #2196F3;
}

.status-green {
  border-color: #4CAF50;
}

.status-yellow {
  border-color: #FFEB3B;
}

.status-red {
  border-color: #F44336;
}






@media (min-width: 992px) {
  #layoutSidenav #layoutSidenav_nav {
    transform: translateX(0);
  }
  #layoutSidenav #layoutSidenav_content{
    margin-left: 0px;
    transition: margin 0.15s ease-in-out;
  }
  .sb-sidenav-toggled #layoutSidenav #layoutSidenav_nav {
    transform: translateX(-278px);
  }
  .sb-sidenav-toggled #layoutSidenav #layoutSidenav_content {
    margin-left: -278px;
  }
  .sb-sidenav-toggled #layoutSidenav #layoutSidenav_content:before {
    display: none;
  }

}

.uiBrandLogo img{
	margin-left: 0px !important;
}