.topnav .navbar-nav .nav-link {
  font-size: 13px;
  position: relative;
  padding: auto;
  min-width: 90px;
  text-align: center;
}

.form-label-outlined {
  position: absolute;
  border: 1px solid #eee;
  border-bottom: 0;
  top: 0.4375rem;
  border-right: 0;
  left: 1.2rem;
  transform-origin: left;
  padding: 0 0.4rem;
  font-weight: 400;
  line-height: 1.25rem;
  color: #526276;
  background-color: #fff;
  z-index: 1;
  transition: all 0.3s ease;
  margin-bottom: 0;
  font-size: 0.8125rem;
}

.form-control-wrap {
  position: relative;
}

.focused .form-label-outlined,
.form-select~.form-label-outlined {
  top: 0px;
  font-size: 11px;
  line-height: 1px;
  border-right: 1px solid #eee;
  border-top: 0;
  z-index: 5;

}

.pr-2 {
  padding-right: 2px;
}

a {
  cursor: pointer !important;
}


@media only screen and (max-width: 1366px) {
  .card-body.overflow-x-auto {
    width: 100% !important;
    overflow-x: scroll;
  }

  .enlarge-menu .card-body.overflow-x-auto {
    width: 100% !important;
    overflow-x: scroll;
  }
}

@media only screen and (min-width: 1224px) {
  .card-body.overflow-x-auto {
    width: 100%;
    overflow-x: scroll;
  }

  .page-wrapper {
    flex: 1;
    padding: 0;
    display: block;
    margin-left: 17%;
    width: 80%;
  }

  .left-sidenav {
    min-width: 17%;
    max-width: 17%;
  }

  .modal-overflow {
    max-width: 100%;
    overflow-x: auto;
  }

  .enlarge-menu .card-body.overflow-x-auto {
    width: 100% !important;
    overflow-x: scroll;
  }
}

/* Large screens ----------- */
@media only screen and (min-width: 1824px) {
  /* Styles */

  .card-body.overflow-x-auto {
    width: 100%;
    overflow-x: scroll;
  }

  .modal-overflow {
    max-width: 100%;
    overflow-x: auto;
  }

  .enlarge-menu .card-body.overflow-x-auto {
    width: 100% !important;
    overflow-x: scroll;
  }
}

table.dataTable.nowrap th, table.dataTable.nowrap td {
    white-space: nowrap;
    vertical-align: middle;
    padding: 15px;
    font-weight: 400;
}

tbody, td, tfoot, th, thead, tr {
  border-color: inherit;
  border-style: solid;
  border-width: 0;
  vertical-align: baseline;
}


.font-size-55 {
  font-size: 55px;
}

.modal-header, .modal-footer {
  padding: 7px 10px;
}

.btn:active:focus, .btn-check:focus+.btn, .btn:focus {

  box-shadow: none !important;
}

.select2-container {
  width: 100% !important;
  background: #fff;
  color: var(--bs-gray-700);
}

.float-initial {
  float: initial;
  display: inline;
}

.btn-sm .bx {
  font-size: 14px;
}

.half-row tr {
  width: 50%;
  float: left;
  border-bottom-width: 1px;
}

.half-row tr td {
  border: 0;
}


.half-row tr td:first-child {
  font-weight: bold;
}

.flex-container {
  display: flex;
  flex-direction: column;
  width: 50%;
}

.flex-container>div {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  /* Adjust as needed */
}

.flex-container span {
  margin-right: 10px;
  /* Adjust as needed */
}

.display-inline {
  display: inline;
}

@media (min-width: 576px) {
  .modal-md {
    --bs-modal-width: 700px;
  }
}

#datatable-buttons tr td:last-child {
  padding-right: 30px;
}


.left-align .datepicker {
  left: 0;
}

.datepicker .table-condensed>tbody>tr>td, .table-condensed>thead>tr>th {
  padding: 4px;
  font-size: 13px;
}

.modal-body .card-body .table-sm tr:last-child {
  border-bottom: 1px transparent;
}

.w-full .iti {
  width: 100%;
}

.input-group .btn {

  border: 1px solid var(--bs-input-border-color);

}

.cards {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  /* Ensure the container takes up the full height */
  text-align: center;
  margin: 0;
}

.cards h6 {
  font-size: 14px;
  line-height: normal;
  color: #000 !important;
  margin: 0;
  height: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 15px;
}

.cards span {
  font-size: 18px;
  color: #000;
  font-weight: 500;
  line-height: normal;
  margin: auto;
}


.block-cards {
  background: #fff;
  padding: 5px 12px 8px;
  border-radius: 4px;
  width: 100%;
  margin: 0 5px;
  font-weight: 600;
  border: 1px solid #fff;
  line-height: normal;
  align-items: center !important;
  justify-content: center !important;

}

.block-cards span {
  font-size: 14px;
  color: #000;
  font-weight: 500;
  line-height: normal;
}

.counter {
  font-size: 16px;
  line-height: normal;
  font-weight: 600;
  color: #fff !important;
  margin: 0 0 0 12px
}

.blocks {
  margin-left: 5px;
  margin-right: 5px;
  padding-right: 5px;
  padding-left: 5px;
  align-items: center !important;
  justify-content: center !important;
  line-height: normal;
}

.logs-table .dataTables_length, .logs-table .dataTables_filter {
  display: none;
}

#datatable-buttons_wrapper .dropdown-item {
  color: #707070;
}

#datatable-buttons_wrapper .dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #1E2866;
}

.text-underline {
  text-decoration: underline !important;
}

.dataTables_paginate {
  float: right;
}

.input-group .form-select {
  border-bottom-left-radius: 3px !important;
  border-top-left-radius: 3px !important;

}



.blog-stats-wid .card-body {
  border-radius: var(--bs-border-radius) !important;
  color: #fff !important;
  background-color: rgba(42, 56, 143, 1) !important;
}

.dashboardrow .col-xl {
  padding: 5px;
}

/* .dashboardrow .blog-stats-wid{

}
.dashboardcol{
  min-height: 60px;
}
.dashboardcol .blog-stats-wid{
  height: 100%;
} */


.table-with-gap {
  margin-bottom: 70px;
  /* Adjust the margin-bottom to create the desired gap */
}

.table-with-gap tbody:first-child {
  margin-bottom: 0;
  /* Remove margin-bottom from the first tbody */
}

.collapse .contents tr, .collapse .contents td {
  border: 0;
}

.tablehead-primary {
  --bs-table-color: #000;
  --bs-table-bg: #1F4291;
  --bs-table-border-color: #1F4291;
  --bs-table-striped-bg: #1F4291;
  --bs-table-striped-color: #000;
  --bs-table-active-bg: #1F4291;
  --bs-table-active-color: #000;
  --bs-table-hover-bg: #1F4291;
  --bs-table-hover-color: #000;
  color: #fff;
  border-color: var(--bs-table-border-color);
}

.noncollapsetable td {
  font-size: 12px;
  font-weight: 400;
}

.noncollapsetable b, .noncollapsetable strong {
  font-weight: 600;
}

.text-decor {
  text-decoration: underline !important;
}


/* Ensure the mega menu is hidden by default */
.dropdown-mega .dropdown-menu {
  display: none;
}

/* Optional: Style for showing the menu on click (handled by JavaScript) */
.dropdown-mega .show {
  display: block;
}

/* Prevent hover behavior for the mega menu */
@media (min-width: 992px) {
  .topnav .dropdown-mega:hover>.dropdown-menu {
    display: block;
    /* Disable hover display */
  }

  .topnav .dropdown:hover>.dropdown-menu {
    display: block;
    /* Disable hover display for all dropdowns */
  }
}



.blog-stats-wid {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.blog-stats-wid .card-body {
  display: flex;
  flex-direction: column;
  padding: 0 10px;
}

.col-7-custom {
  flex: 0 0 calc(100% / 7);
  max-width: calc(100% / 7);
}

@media (min-width: 992px) {

  /* For large devices */
  .col-lg-1-7 {
    flex: 0 0 calc(100% / 7);
    max-width: calc(100% / 7);
  }
}

@media (min-width: 1200px) {

  /* For extra large devices */
  .col-xl-1-7 {
    flex: 0 0 calc(100% / 7);
    max-width: calc(100% / 7);
  }
}


.mini-stats-wid .card-body{
  padding: 15px;
}
.mini-stats-wid p{
  font-weight: 500;
}
.font-size-26{
  font-size: 26px;
}
/* Grid layout for six columns */
.dashboard6 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  /* 6 columns on each row */
  gap: 1rem;
  /* Space between cards */
}
.mini-stats-wid {
    background-color: #fff !important;
    border: 1px solid #e9e9e9e1;
}
.dashboard6 .card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    height: 100%;
    min-height: 20px;
    color: #000;
    padding: 10px 0;
    margin: 0;
background-color: #fff !important;
    border: 1px solid #c3d8e57d;
  }
.dashboard7 .card {
   display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    height: 100%;
    min-height: 20px;
background-color: #fff !important;
    border: 1px solid #c3d8e57d;    color: #000;
    padding: 10px 0;
    margin: 0;
}
.dashboard8 .card {
     background-color: #699ae514 !important;
    border: 1px solid #b9cfdd;
    color: #000;
    padding: 10px 0;
    margin: 0;
}
.dashboard6 .card-body {

  padding: 0 10px;
  justify-content: space-between;
  /* Position text and number on left and right */
  align-items: center;
  /* Center align content vertically */
}

.dashboard6 .card-body p {
    font-size: 13px;
    margin: 0;
    font-weight: 500;
}
.dashboard6 .card-body h5 {
  margin: 0;
  /* Remove default margin */
  font-size: 14px;
  /* Adjust font size if necessary */
  font-weight: 600;

}

/* Responsive behavior for smaller screens */
@media (max-width: 992px) {
  .dashboard6 {
    grid-template-columns: repeat(3, 1fr);
    /* 3 columns per row on medium screens */
  }
}

@media (max-width: 768px) {
  .dashboard6 {
    grid-template-columns: repeat(2, 1fr);
    /* 2 columns per row on smaller screens */
  }
}

@media (max-width: 576px) {
  .dashboard6 {
    grid-template-columns: 1fr;
    /* 1 column per row on very small screens */
  }
}


.text-primary {
    --bs-text-opacity: 1;
       color: rgb(11 62 116) !important;

}
.text-primary2{
    color:rgb(12 39 82) !important;


}


/* Grid layout for six columns */
.dashboard7 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
}



.dashboard7 .card-body {
  flex: 1;
  /* Allow card body to stretch */
  display: flex;
  padding: 0 10px;
  justify-content: space-between;
  /* Position text and number on left and right */
  align-items: center;
  /* Center align content vertically */
}

.dashboard7 .card-body p {
  margin: 0;
  /* Remove default margin */
  font-weight: 500;
  /* Make text bold */
}

.dashboard7 .card-body h5 {
  margin: 0;
  /* Remove default margin */
  font-size: 14px;
  /* Adjust font size if necessary */
  font-weight: 600;

}

/* Responsive behavior for smaller screens */
@media (max-width: 992px) {
  .dashboard7 {
    grid-template-columns: repeat(3, 1fr);
    /* 3 columns per row on medium screens */
  }
}

@media (max-width: 768px) {
  .dashboard7 {
    grid-template-columns: repeat(2, 1fr);
    /* 2 columns per row on smaller screens */
  }
}

@media (max-width: 576px) {
  .dashboard7 {
    grid-template-columns: 1fr;
    /* 1 column per row on very small screens */
  }
}



/* Grid layout for six columns */
.dashboard8 {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  /* 8 columns on each row */
  gap: 1rem;
  /* Space between cards */
}


.dashboard8 .card-body {
  flex: 1;
  /* Allow card body to stretch */
  display: flex;
  flex-direction: column;
  /* Stack content vertically */
  justify-content: center;
  /* Center the content vertically */
  align-items: center;
  /* Center the content horizontally */
  padding: 0 10px;
  text-align: center;
}


.dashboard8 .card-body p {
  margin: 0;
  /* Remove default margin */
  /* font-weight: bold; */
  /* Make text bold */
  display: block;
  /* Ensure p is a block element */
}

.dashboard8 .card-body h5 {
  margin: 0;
  /* Remove default margin */
  font-size: 14px;
  /* Adjust font size if necessary */
  display: block;
  /* Ensure h5 is a block element */
  padding-top: 5px;
  /* Optional: Add space between p and h5 */
  font-weight: 600;
}

/* Responsive behavior for smaller screens */
@media (max-width: 992px) {
  .dashboard8 {
    grid-template-columns: repeat(3, 1fr);
    /* 3 columns per row on medium screens */
  }
}

@media (max-width: 768px) {
  .dashboard8 {
    grid-template-columns: repeat(2, 1fr);
    /* 2 columns per row on smaller screens */
  }
}

@media (max-width: 576px) {
  .dashboard8 {
    grid-template-columns: 1fr;
    /* 1 column per row on very small screens */
  }
}

.topnav .topnav-menu {
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.right-bar {
  background-color: #2b398f;
  width: 245px;
}
.navbar-brand-box {
    padding: 0 0;
    text-align: center;
    width: 225px;
}

.vertical-menu {
  width: 225px;
  z-index: 1001;
  background: #2b398f;
}

body {
  font-size: 12px;
}

.navbar-nav {
  display: flex;
  justify-content: flex-start;
  /* Default - keeps items aligned left */
  width: 100%;
}



/* Font size for laptops with width of exactly 1440px */
@media (max-width: 1440px) {
  body[data-layout="horizontal"][data-topbar="light"] .topnav .navbar-nav .nav-link {
    font-size: 14px;
    /* font size for laptops with 1440px width */
    text-wrap: nowrap;
    padding: 14px 15px;
  }

  .topnav .navbar, .topnav .navbar-nav .nav-item .nav-link.active {
    height: 50px;
  }

}

/* Font size for very small screens (566px and below) */
@media (max-width: 566px) {
  body[data-layout="horizontal"][data-topbar="light"] .topnav .navbar-nav .nav-link {
    font-size: 10px;
    /* font size for screens up to 566px */
  }

  .topnav .navbar, .topnav .navbar-nav .nav-item .nav-link.active {
    height: 50px;
  }

}

/* Font size for laptops with width of exactly 1024px */
@media (max-width: 1024px) {
  body[data-layout="horizontal"][data-topbar="light"] .topnav .navbar-nav .nav-link {
    text-align: left;
    font-size: 9px;
    /* font size for laptops or tablets with 1024px width */
    padding: 6px 15px;
  }

  .topnav .navbar {
    height: auto;
  }

  .topnav .navbar-nav .nav-item .nav-link.active {
    height: 100%;
  }

  .topnav .dropdown .dropdown-item {
    font-size: 9px;
    /* font size for laptops or tablets with 1024px width */

  }

}
body {
    font-size: 14px;
    font-weight: 400;
}

.metismenu li {
  display: block;
  width: 100%;
  /* border-bottom: 1px solid #fff7f71f; */
}

.right-bar .right-bar-toggle {
  background-color: #ffffff;
  height: 35px;
  width: 35px;
  line-height: 35px;
  display: block;
  color: #000000;
  text-align: center;
  border-radius: 50%;
  font-size: 20px;
}

#sidebar-menu ul li a {
  display: block;
  padding: 0.625rem 1.5rem;
  color: #fff;
}

#sidebar-menu ul li ul.sub-menu li a {
  padding: 0.4rem 1.5rem 0.4rem 1.5rem;
  font-size: 13px;
  color: #e2e3e7;
}

#sidebar-menu .mm-active>a {
  color: #e91c24 !important;
}

#sidebar-menu ul li ul.sub-menu li a:hover {
  color: #fff;
}

#sidebar-menu ul li a:hover {
  color: #fff;
}

.right-bar .right-bar-toggle:hover {
  background-color: #e91c24;
}


.navbar-nav {
  flex-wrap: wrap;
}

/* .dropdown-menu {
  max-height: 500px;
  overflow-y: auto;
} */


@media (min-width: 992px) {
  body[data-layout="horizontal"][data-topbar="light"] .topnav .navbar-nav .dropdown-menu .nav-link {
    color: #070707 !important;
    padding: 7px 10px;
  }
}

/* Show the dropdown menu on hover */
.topnav .dropdown:hover>.dropdown-menu {
  display: block;
}

/* Show submenu on hover and position it to the left */
.topnav .dropdown-menu .dropdown:hover>.dropdown-menuright {
  position: absolute;
  top: 0 !important;
  left: -100%;
  display: block;
}

.bg-orange {
  background-color: chocolate;
}

.categories-list {
  font-size: 14px;
}

.compliance-sidebar {
  top: 125px;
  left: 0;
  height: 100vh;
  overflow-y: auto;
  background-color: #fff;
  border-right: 1px solid #ddd;
  z-index: 1030;
  padding: 15px;
  position: fixed;
  width:17%;
}



.content-area {
    padding: 20px;
    width: 83%;
    margin-left: 17%;
}
.fs-14{
  font-size: 14px;
}



@media (max-width: 768px) {
   .navbar-brand-box {
    display: block;
  }
  .compliance-sidebar {
      position: static;
      padding: 0;
      width: 100%;

      height: auto;
  }
  .content-area {
    padding: 20px;
    width: 100%;
    margin-left: 0%;
  }
}

@media (max-width: 576px) {
  .navbar-brand-box {
    display: block;
  }
  .compliance-sidebar {
      position: static;
      padding: 0;
      width: 100%;

      height: auto;
  }
  .content-area {
    padding: 20px;
    width: 100%;
    margin-left: 0%;
  }
}


.sticky-sidebar {
  position: sticky;
  top: 0;
  height: 120vh;
  overflow-y: auto;
  margin: 0;
}


.sticky-sidebar  ul li {
    display: block;
    width: 100%;
    border-bottom: 1px solid #fff7f7;
}


.sticky-sidebar  ul li a i {
    display: inline-block;
    min-width: 0;
    padding-bottom: 0.125em;
    font-size: 1.15rem;
    line-height: 1.40625rem;
    vertical-align: middle;
    color: #7f8387;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}


.bg-danger {
    background-color: rgb(249 69 69) !important;
}
.bg-orange {
    background-color: #f56832;
}

 .table-vert-center td,
  .table-vert-center th {
    vertical-align: middle !important;
  }


  #sidebar-menu ul li a {
    display: block;
    padding: 0.425rem 1.5rem;
    color: #545a6d;
    position: relative;
    font-size: 13px;
}
.fw-medium{
  font-weight: 400px;
}
.text-black-75 {
  --bs-text-opacity: 1;
  color: rgba(0, 0, 0, 0.75) !important;
}

 .mm-active .content-area{
  color: #000 !important;
}
#sidebar-menu .mm-active>a {
    color: #fff !important;
}
.main-content {
    margin-left: 225px;
    overflow: hidden;
}

body[data-sidebar="colored"] #sidebar-menu ul li a {
    color: rgba(255, 255, 255, .6);
}

body[data-sidebar="colored"] .mm-active > a i {
    color: #fff !important;
    background: transparent;
}
body[data-sidebar="colored"] .mm-active .active, body[data-sidebar="colored"] .mm-active > i {
    color: #fff !important;
    background: #011f4d;
}
.mm-active .active i {
    color: #b8d0ef !important;
}
#sidebar-menu .mm-active>a {
    color: #fff !important;
    background: #19639b;
}

.table-dark {
    --bs-table-bg: #0b2650;
   
}
.tablehead-primary {
    --bs-table-color: #000;
    --bs-table-bg: #0b2650;
}
.page-title-box h4 {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 16px !important;
    color: #19639b;
}

.sidebar-prime .sidebar-footer {
    background-color: #506fd9;
    border-top-color: rgba(255, 255, 255, .12);
    box-shadow: none;
}

/* ==========================================
   Sidebar Layout
========================================== */

.vertical-menu{
    position: fixed;
    top: 70px;
    left: 0;
    bottom: 0;
}

/* .vertical-menu .simplebar-wrapper,
.vertical-menu .simplebar-mask,
.vertical-menu .simplebar-content-wrapper{
    height: 100%;
}

.vertical-menu [data-simplebar]{
    height: calc(100% - 80px); 
}

#sidebar-menu{
    height: calc(100% - 75px);
    overflow-y: auto;
    padding-bottom: 250px; 
} */
#sidebar-menu{
    padding-bottom: 100px; /* only leave space for footer */
}

/* ==========================================
   Sidebar Footer
========================================== */

.sidebar-footer{
    position: sticky;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 100;
    width: 100%;
    background: #0b2650;
    border-top: 1px solid rgba(255,255,255,.1);
}

.sidebar-footer-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    cursor: pointer;
}


/* ==========================================
   User Info
========================================== */

.sidebar-user{
    display: flex;
    align-items: center;
}

.sidebar-user img{
    width: 42px;
    height: 42px;
    object-fit: cover;
    border-radius: 50%;
}

.sidebar-user-info{
    margin-left: 12px;
}

.sidebar-user-info h6{
    margin: 0;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
}

.sidebar-user-info span{
    font-size: 12px;
    color: rgba(255,255,255,.7);
}


/* ==========================================
   Footer Menu
========================================== */

.footer-arrow{
    font-size: 22px;
    transition: transform .3s;
}

.sidebar-footer-menu{
    display: none;
    background: #0b2650;
}

.sidebar-footer.active .sidebar-footer-menu{
    display: block;
}

.sidebar-footer.active .footer-arrow{
    transform: rotate(180deg);
}

.sidebar-footer-menu a {
    display: flex;
    align-items: center;
    padding: 7px 20px;
    font-size: 13px;
    color: #99a4b6;
    text-decoration: none;
    transition: background .2s, color .2s;
}

.sidebar-footer-menu a i{
    width: 25px;
    font-size: 18px;
}

.sidebar-footer-menu a:hover{
    background: rgba(255,255,255,.08);
    color: #fff;
}

.footer-divider{
    height: 1px;
    margin: 8px 0;
    background: rgba(255,255,255,.15);
}


body[data-sidebar="colored"] #sidebar-menu ul li ul.sub-menu li a {
    color: #99a4b6  !important;
}

.btn-filter .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* no fixed width/height, no forced padding:0 */
    width: 50%;
}
.btn-filter{
  width: 100%;
}
.auth-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: luminosity;
    opacity: .3;
}
.left-loginbanner{
  min-height: 100vh;
}
.left-loginbanner img{
  min-height: 100vh;
}