/*
 * ====================================================================
 * Pavo Admin Dashboard - Custom Styles
 * Copyright © 2024 RefineThemes.com
 * Author: Saleem Raza
 * Founder: RefineThemes.com
 * License: MIT
 * ====================================================================
 */

html,
body {
  background-color: #dee2e6;
  font-family: "Open Sans",sans-serif;
  font-weight: 500;
  line-height: 1.5;
  color: #6c757d;
  margin: 0;
  padding: 0;
  font-size: 15px;
  position: relative;
}
html{
  scrollbar-width: thin !important;
  border: none !important;
  border-style: none !important;
  background-color: transparent !important;
  scrollbar-color: #8383835e transparent !important;
}
h1{
  font-size: 28px !important;
}
h2{
  font-size: 24px !important;
}
h3{
  font-size: 20px !important;
}
h4{
  font-size: 18px !important;
}
h5{
  font-size: 16px !important;
}
h6{
  font-size: 14px !important;
}
.text-small{
  font-size: 13px;
}
.star{
  margin-top: -5px;
}
.gt{
  --bs-gutter-y: 0.3125rem;
  --bs-gutter-x: 0.3125rem;
}
:root {
  --bs-breakpoint-xs: 0;
  --bs-breakpoint-sm: 576px;
  --bs-breakpoint-md: 768px;
  --bs-breakpoint-lg: 992px;
  --bs-breakpoint-xl: 1200px;
  --bs-breakpoint-xxl: 1400px;
  --bs-breakpoint-xxxl: 1800px;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  color: inherit;
}

p{
  font-size: 10px !important;
}
.small {
  font-size: 12px;
  font-weight: 400;
  color: inherit;
}
small {
  font-size: 8px;
  font-weight: 400;
  color: inherit;
}
.see-all-icon{
  width:16px;
  height: 16px;
}
/*
* Custom Shake Effect CSS
*/
.shake {
  -webkit-animation: shake 1.5s ease infinite;
  animation: shake 1.5s ease infinite;
}
@keyframes shake {
  0%,
  25%,
  83%,
  100% {
      transform: rotatez(0deg)
  }
  32.5%,
  62.5% {
      transform: rotatez(-20deg)
  }
  47.5%,
  75.5% {
      transform: rotatez(20deg)
  }
  87.5%,
  95.5% {
      transform: rotatez(10deg)
  }
}
/* 
* Place Holder
*/
.navbar-brand{
  background-color: inherit;
  padding:10px 15px !important;
}
.navbar-brand span, .navbar-brand strong{
  color:inherit;
}
.page-wrapper{
  width:100%;
}
.navbar {
  position: relative;
  padding:2px 5px 15px 5px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  height: 2.5rem;
  box-shadow: 0.5rem 0 0.5rem rgba(0, 0, 0, 0.15)!important;
}
.bi {
  display: inline-block;
  width: 1rem;
  height: 1rem;
}
.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}
.b-example-divider {
  width: 100%;
  height: 3rem;
  background-color: rgba(0, 0, 0, .1);
  border: solid rgba(0, 0, 0, .15);
  border-width: 1px 0;
  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}
.b-example-vr {
  flex-shrink: 0;
  width: 1.5rem;
  height: 100vh;
}
.bi {
  vertical-align: -.125em;
  fill: currentColor;
}
.nav-scroller {
  position: relative;
  z-index: 2;
  height: 2.75rem;
  overflow-y: hidden;
}
.nav-scroller .nav {
  display: flex;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  margin-top: -1px;
  overflow-x: auto;
  text-align: center;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}
.btn-bd-primary {
  --bd-violet-bg: crimson;
  --bd-violet-rgb: 112.520718, 44.062154, 249.437846;
  --bs-btn-font-weight: 600;
  --bs-btn-color: var(--bs-white);
  --bs-btn-bg: var(--bd-violet-bg);
  --bs-btn-border-color: var(--bd-violet-bg);
  --bs-btn-hover-color: var(--bs-white);
  --bs-btn-hover-bg: rgb(231, 37, 75);
  --bs-btn-hover-border-color: rgb(221, 36, 73);
  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
  --bs-btn-active-color: var(--bs-btn-hover-color);
  --bs-btn-active-bg: rgb(231, 40, 78);
  --bs-btn-active-border-color: rgb(214, 34, 70);
}
.bd-mode-toggle {
  z-index: 1500;
}
.bd-mode-toggle .dropdown-menu .active .bi {
  display: block !important;
}
/*
* Main Content
*/
.main-container{
  display: flex;
  height: 100%; /* Full height of the parent */
  overflow: hidden;
  position: relative;
}
.main-content{
  flex: 1;
  background-color: #dee2e6;
}
/*
 * Sidebar
*/
.sidebar{
  width: 14rem;
  background-color: #4b5158;
  float:left;
  position: relative;
  padding-bottom:20px;
  height:auto;
}
.content{
  padding:4px 6px 4px 4px;
  margin-bottom: 28px !important;
}
.sidebar-flat-menu .sidebar #menu li .nav-link{
  margin: 0px !important;
  padding: 8px 10px !important;
}
.sidebar-flat-menu .sidebar #menu ul li .nav-link{
  align-items: center;
  padding: 0rem 0.3rem !important;
  text-decoration: none;
  transition: all .2s ease-in-out;
  margin: 0px !important;
  text-transform: capitalize !important;
}
.sidebar-flat-menu .sidebar #menu .nav-item .nav-link{
  text-transform: uppercase !important;
  font-weight: 400;
  font-size: 10px !important;
}
.sidebar-flat-menu .sidebar #menu .nav-item.mm-active a.has-arrow{
  margin: 0px;
  background-color: rgba(0, 0, 0, 0.2) !important;
  box-shadow: 1rem 0.5rem 1rem rgba(0, 0, 0, 0.4)!important;
}
.sidebar-flat-menu .sidebar ul li ul{
  padding-inline-start: 10px;
}
.sidebar ul li ul{
  margin: 2px 13px !important;
  background-color: transparent;
}
.sidebar-flat-menu .sidebar #menu .nav-link .menu-icon-bg{
  background: hsla(0,0%,100%,.15);
  padding: 0.4rem 0.1rem !important;
  justify-content: center;
  align-items: center;
  margin: 0.2rem;
}
.sidebar-flat-menu .sidebar #menu .nav-link .feather {
  align-items: center;
  font-size: .875rem;
  height: 0.8rem;
  width: 0.8rem;
}
.sidebar .scroller h6{
  color: #fff;
  font-size: 0.9rem !important;
  font-weight: 500;
  text-transform: uppercase !important;
}
.sidebar-sticky.active .main-content{
  width: 100% !important;
}
.sidebar-sticky .main-content{
  width: calc(100% - 14rem);
  margin-left: 14rem !important;
}
.rtl-layout.sidebar-sticky .main-content{
  margin-left: 0rem !important;
  margin-right: 14rem !important;
}
.rtl-layout.sidebar-offcanvas .main-content{
  margin-left: 0rem !important;
  margin-right: 0rem !important;
}
.sidebar-sticky .sidebar{
  position: relative;
  left:0 !important;
  right:auto !important;
  float:left !important;
}
.rtl-layout.sidebar-sticky .sidebar{
  left:auto !important;
  right:0 !important;
  float:right !important;
}
.sidebar-offcanvas.sidebar-sticky.active .sidebar-footer,
.sidebar-offcanvas.rtl-layout.sidebar-sticky.active .sidebar-footer{
  display: none !important;
}
.marge-right-sidebar .main-container{
  min-height:1560.10px;
}
.marge-right-sidebar .settings-menu,
.marge-right-sidebar .settings-menu .bg-gray-light{
  margin-top: 0px !important;
  box-shadow: none;
  margin-right: 0px !important;
  border-radius: 0px !important;
  margin-bottom: 0px !important;
  color:#fff !important;
}
.marge-right-sidebar .panel-title{
  position: absolute;
  margin: 0px -9px !important;
  top:0;
  left:0;
  right:0;
  bottom:0;
  height:41.6px !important;
  padding: 0.6rem 1rem;
  box-shadow: 0.5rem 0 0.5rem rgba(0, 0, 0, 0.15)!important;
}
.dark-theme.marge-right-sidebar .settings-menu .panel-title{
  border-bottom:4px solid #131313 !important;
}
.marge-right-sidebar .panel-title svg{
  width:17px;
  height:17px;
}
.marge-right-sidebar .panel-title span{
  padding-top: 2px;
  font-size: 13px !important;
  font-weight: 100;
}
.marge-right-sidebar .settings-margin{
  margin-top: 2rem;
}
.dark-theme text {
  fill: #fff !important;
}
.dark-theme.marge-right-sidebar .settings-menu .text-dark,
.dark-theme.marge-right-sidebar .panel-title,
.dark-theme.marge-right-sidebar .settings-menu .text-muted,
.dark-theme.marge-right-sidebar .settings-menu .settings-menu h6{
  color:#fff !important;
}
.light-theme.marge-right-sidebar .settings-menu .text-dark,
.light-theme.marge-right-sidebar .settings-menu .text-muted,
.light-theme.marge-right-sidebar .settings-menu .settings-menu h6{
  color:#fff !important;
}
.light-theme.marge-right-sidebar .settings-menu,
.light-theme.marge-right-sidebar .settings-menu .panel-title{
  background-color: #4b5158;
}
.marge-right-sidebar .navbar{
  width:100%;
}
.marge-right-sidebar .main-content{
  margin-right: 13.99rem;
  height: 100%;
}
.marge-right-sidebar .content{
  padding-right: 4px !important;
  height: 100%;
}
.marge-right-sidebar .footer{
  width:calc(100% - 27.60rem) !important;
  margin-right: 230px !important;
}
.marge-right-sidebar .mega-menu{
  position: absolute !important;
  width:calc(100vw - 220px) !important;
  left:0px;
  top:28px;
  z-index: 2999;
  border: 2px solid rgba(45, 53, 60, 0.95) !important;
}
.dark-theme tspan{
  fill:#fff !important;
}
.dark-theme.marge-right-sidebar .mega-menu,
.dark-theme.marge-right-sidebar .mega-menu .dropdown-menu{
  background-color: rgba(45, 53, 60, 0.95) !important;
  color:#fff !important;
}
.dark-theme .mega-menu,
.dark-theme .mega-menu .dropdown-menu{
  background-color: rgba(45, 53, 60, 0.95) !important;
  color:#fff !important;
}
.dark-theme .mega-menu .dropdown,
.dark-theme .mega-menu.active .dropdown-menu a,
.dark-theme .mega-menu.active .text-dark{
  color:#fff !important;
}
.dark-theme.marge-right-sidebar .mega-menu .dropdown,
.dark-theme.marge-right-sidebar .mega-menu.active .dropdown-menu a,
.dark-theme.marge-right-sidebar .mega-menu.active .text-dark{
  color:#fff !important;
}
.dark-theme.marge-right-sidebar .mega-menu .col-md-3{
  border-color: #232323 !important;
}
.dark-theme.marge-right-sidebar .mega-menu .col-md-3 .resource-links{
  border-color: #2e2e2e !important;
  border:none !important;
}
.dark-theme .mega-menu .col-md-3{
  border-color: #232323 !important;
}
.dark-theme .mega-menu .col-md-3 .resource-links{
  border-color: #2e2e2e !important;
  border:none !important;
}
.dark-theme .dropdown-item:focus,
.dark-theme .dropdown-item:hover{
  color:#fff !important;
  background-color: #424d57 !important;
}
.dark-theme.marge-right-sidebar .mega-menu .col-md-3 .dropdown-item:focus,
.dark-theme.marge-right-sidebar .mega-menu .col-md-3 .dropdown-item:hover{
  color:#fff !important;
  background-color: #424d57 !important;
}
.dark-theme .mega-menu .col-md-3 .dropdown-item:focus,
.dark-theme .mega-menu .col-md-3 .dropdown-item:hover{
  color:#fff !important;
  background-color: #424d57 !important;
}
.fixed-sidebar .sidebar{
  position: fixed;
}
.fixed-sidebar .sidebar .scroller{
  padding-bottom: 120px;
}
.sidebar-on-top .navbar{
  width:100%;
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.sidebar-on-top .settings-menu{
  z-index: 4444 !important;
}
.push-sidebar .main-container{
  overflow: hidden !important;
}
.push-sidebar .navbar,
.push-sidebar .main-content,
.push-sidebar .content,
.push-sidebar .footer{
  width: calc(100% + 14rem) !important;
}
.push-sidebar.active .navbar,
.push-sidebar.active .main-content,
.push-sidebar.active .content{
  width: 100% !important;
}
.push-sidebar.active .sidebar{
  left: -14rem;
  margin-left: -14rem;
  width: -14rem;
}
.push-sidebar .sidebar{
  display: block;
}
@keyframes push-in {
  from {
      margin-left: 0rem;
  }

  to {
      margin-left: 14rem;
  }
}
.sidebar-on-top .navbar-brand a .close-btn{
  display:block !important;
}
#overlay {
  display: none;
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}
.sidebar .navbar-brand{
  height: 2.5rem;
  width:14rem;
  padding: 0.5rem 0.95rem;
  font-size: 1.1rem;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, .25%);
}
.light-theme .input-group-text{
  background-color: inherit;
  color:#fff;
}
.light-theme .input-group-text::after{
  background-color: #4b5158;
  color:#fff;
}
.fixed-header .navbar,
.fixed-header .navbar-brand{
  z-index: 2050;
  position:fixed;
  top:0;
}
.marge-right-sidebar.fixed-header .panel-title{
  width:224px;
  z-index: 2050;
  position:fixed;
  top:0;
  left:auto;
  right:0;
}
.light-theme.marge-right-sidebar.fixed-header .panel-title{
  padding: 9px 15px;
}
.dark-theme.marge-right-sidebar.fixed-header .panel-title{
  background-color: rgba(45, 53, 60, 0.95);
}
.fixed-header.active .navbar{
  width: 100% !important;
}
.fixed-header .navbar{
  width: calc(100% - 14rem);
}
.marge-right-sidebar.fixed-header .navbar{
  width: calc(100% - 27rem);
  margin-right: 14rem;
  top:0 !important;
  margin-top: 0px !important;
}
.sidebar-on-top.fixed-header .navbar{
  width: 100% !important;
}
.fixed-header .sidebar{
  padding-bottom:20px !important;
}
.fixed-header .navbar-brand{
  position: fixed;
  top:0;
  margin-top: 0px;
  z-index: 2050;
}
.fixed-header .sidebar,
.fixed-header .main-content{
  margin-top:37px;
}
.sidebar-offcanvas.active .sidebar{
  width: -220px !important;
  margin-left: -220px;
  position: absolute;
  z-index: 2040;
}
.sidebar-offcanvas .sidebar{
  display: block;
}
.sidebar-offcanvas .main-content{
  width: 100% !important;
}
.rtl-layout .content{
  padding:6px 4px 6px 6px !important;
}
.rtl-layout .footer{
  width:calc(100% - 13.78rem) !important;
  margin-left:6px !important;
  margin-right:14rem !important;
}
.sidebar-offcanvas .footer{
  width:calc(100% - 10px) !important;
  margin-left: 4px !important;
  margin-right: 4px !important;
}
.rtl-layout.sidebar-offcanvas .footer{
  width:calc(100% - 10px) !important;
  margin-left: 4px !important;
  margin-right: 4px !important;
}
@keyframes slideInLeft {
  from {
      transform: translateX(-100%);
      opacity: 0;
  }
  to {
      transform: translateX(0);
      opacity: 1;
  }
}
.sidebar-sticky .sidebar{
  position: fixed !important;
  top:0;
  left:0;
  height:100vh !important;
  z-index: 2999;
}
.sidebar-offcanvas .main-content{
  width:100% !important;
  margin-left: 0rem !important;
}
.push-sidebar.sidebar-sticky .sidebar,
.sidebar-on-top.sidebar-sticky .sidebar{
  height:auto !important;
}
.sidebar-sticky .sidebar-widgets{
  display:none !important;
}
.sidebar-sticky .sidebar-footer{
  height:30px;
  position: fixed !important;
  bottom: 0;
}
.sidebar-sticky .sidebar .scroller{
  height: 62vh !important;
  min-height: 60vh !important;
  padding-bottom: 50px;
}
.sidebar-static .toggle-up-btn{
  display: none;
}
.sidebar-static .navbar{
  position: static;
  width:100%;
}
.sidebar-static .navbar-brand{
  position: static;
  margin-top: 0px;
  top:0px;
}
.sidebar-static .sidebar{
  width:14rem;
}
.sidebar-offcanvas.active .navbar{
  margin-left: 0px;
}
.sidebar .user-panel {
  display:block;
  max-height:100px !important;
  padding: 1rem;
  background: linear-gradient(rgba(63, 63, 63, 0.7), rgba(63, 71, 78, 0.75)), url(../img/profile-bg.jpg);
  background-size: cover;
  width: 100%;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  transition: max-height 1s ease;
}
.dark-theme .user-panel{
  border-top:5px solid #131313;
}
.hide-profile .sidebar .user-panel{
  max-height: 0px !important;
  padding: 0rem;
  transition: max-height 1s ease;
}
.hide-profile .sidebar .user-panel .user-image{
  visibility: hidden !important;
  opacity:0;
}
.hide-profile .sidebar-widgets{
  margin-bottom: 120px !important;
}
.sidebar .user-panel .user-image {
  position: relative;
  visibility: visible;
  opacity:0;
  transition: opacity 1s ease-out;
  opacity:0;
  transition: opacity 3s ease-out;
  opacity:1;
  transition: opacity 4s ease-out;
}
.sidebar .user-panel .user-image .img-circle {
  margin-bottom: 6px;
}
.sidebar .user-panel .user-image p {
  display: block;
  color: rgba(255, 255, 255, .75);
  font-size: 12px;
  margin-top: -5px;
  line-height: .5rem;
}
.sidebar .user-panel .user-image .img-circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}
.sidebar .user-panel .user-image h6 {
  font-size: 14px;
  display: block;
  color: #fff;
  font-weight: 600;
}
.sidebar .user-panel .user-image .toggle-search {
  color: #fff;
  position: absolute;
  right:0;
  bottom:10px;
  background-color: transparent;
  border: none;
}
.sidebar .user-panel .user-image .toggle-search svg {
  width:16px !important;
  height:16px !important;
  color: #fff;
}
.sidebar .user-panel .user-image .toggle-search:hover {
  color: #fff;
}
.sidebar .sidebar-menu-buttons {
  width: 100%;
  height: auto;
  padding: 1.4rem .7rem 1rem .7rem;
  background-color: rgba(0,0,0,.164);
  box-shadow: 0 1px 1px 0 rgb(0 0 0 / 20%), 0 2px 12px 0 rgb(0 0 0 / 19%);
}
.dark-theme .sidebar .sidebar-menu-buttons{
  border-top:4px solid #131313;
  border-bottom:4px solid #131313;
}
.sidebar .sidebar-menu-buttons .input-group-text {
  color: #333 !important;
  text-align: left;
  height: 36px!important;
  border: none!important;
}
.sidebar .sidebar-menu-buttons .input-group-text::placeholder {
  color: #fff;
  opacity: 1; /* Firefox */
}
.white-theme .sidebar .sidebar-menu-buttons .input-group-text::placeholder {
  color: #333;
  opacity: 1; /* Firefox */
}
.sidebar .sidebar-menu-buttons .input-group-text::-ms-input-placeholder { /* Edge 12-18 */
  color:#fff;
}
.white-theme .sidebar .sidebar-menu-buttons .input-group-text::-ms-input-placeholder { /* Edge 12-18 */
  color:#333;
}
.white-theme .settings-menu{
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
}
.white-theme h1,
.white-theme h2,
.white-theme h3,
.white-theme h4,
.white-theme h5,
.white-theme h6,
.white-theme p,
.white-theme small,
.white-theme strong,
.white-theme em,
.white-theme hr,
.white-theme .text-light,
.white-theme .text-white,
.white-theme .navbar .notifications small,
.white-theme .navbar .notifications .msg-date{
  color:#333 !important;
}
.white-theme .navbar .dropdown-menu,
.white-theme .navbar .messages{
  background-color: #fff !important;
}
.white-theme .navbar .dropdown-menu a:hover{
  height:auto;
  background-color: rgba(0, 0, 0, 0.1) !important;
}
.white-theme .navbar .dropdown-messages li:hover{
  height:auto;
  background-color: rgba(0, 0, 0, 0.1) !important;
  padding:5px;
  border-radius: 10px;
}
.white-theme .sidebar-footer{
  background-color: #fff !important;
  height:30px;
  border-top:1px solid rgba(0, 0, 0, 0.1);
  box-shadow: none;
}
.sidebar .sidebar-menu-buttons .input-group-border {
  box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(0 0 0 / 19%);
  height: 36px!important;
}
.sidebar .sidebar-menu-buttons .input-group>.input-group-append> button {
  color: #fff;
  border: none;
  min-height: 36px!important;
  border-radius: 0px;
}
.sidebar .sidebar-menu-buttons .close-btn{
  width:16px !important;
  height:16px !important;
  background: inherit;
  color: #fff;
  border: none;
  border-radius: 0px;
}
.sidebar .sidebar-menu-buttons a {
  color:#fff;
  width: 20px;
  height: 20px;
  margin: 0px 10px;
  text-decoration: none;
}
.sidebar .sidebar-menu-buttons a svg{
  width: 20px;
  height:20px;
}
.sidebar .nav-link {
  color: #fff;
  line-height: 10px;
}
.sidebar .nav-link .feather {
  width: 20px;
  height: 20px;
  margin-left: 4px;
  margin-right: 4px;
  color: inherit;
}
.sidebar .toggle-search .slide-up-btn{
  display:none;
}
.sidebar .toggle-search.active .slide-up-btn{
  display:block;
}
.sidebar .toggle-search .slide-down-btn{
  display:block;
}
.sidebar .toggle-search.active .slide-down-btn{
  display:none;
}
.sidebar .nav-link {
  font-size: .875rem;
  font-weight: 500;
}
.sidebar .nav-link.active {
  color: #2470dc;
}
.sidebar-heading {
  font-size: .75rem;
}
/*
* Settings Menu
*/
.settings-panel-bg{
  display: none;
  width: 100vw;
  height: 100vh;
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0, 0.4); /* Black w/opacity/see-through */
  z-index: 2010 !important;
  position: fixed;
}
.offcanvas-body {
  flex-grow: 1;
  padding: 1rem;
  overflow-y: auto;
}
#overlay.active{
  display:block;
}
.settings-panel-bg.active{
  display: block;
}
.settings-menu{
  display: none;
  position: fixed;
  z-index: 2099 !important;
  width: 100%;
  background-color: #fff;
  margin: 0px 20px 75px 20px;
  font-size: 12px;
  box-shadow: 0 0.125rem 0.25rem rgba(55,60,67,.075);
  border-radius: 20px;
  padding: 0px 20px;
  overflow:hidden;
  height: 460px;
}
.light-theme .color-header-btn.bg-night,
.light-theme .color-fullheader-btn.bg-night,
.light-theme .color-sidebar-btn.bg-night,
.light-theme .color-brand-btn.bg-night,
.light-theme .color-nav-btn.bg-night,
.light-theme .color-card-btn.bg-night{
  background-color: #2d353c;
}
.settings-menu.active{
  display:block !important;
}
.white-theme .settings-menu,
.white-theme .settings-menu small.text-muted{
  background-color: #fff !important;
  color: #333 !important;
}
.fixed-right-sidebar .settings-menu small.text-muted{
  color:#fff;
}
/* Tablets (landscape and portrait) */
@media screen and (max-width: 786px) {
  .settings-menu {
    height: 80% !important;
    overflow:scroll !important;
    min-width:290px;
  }
}
.settings-arrow{
  background-color: #161a1d;
  z-index: 2030 !important;
}
.settings-arrow::after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  top:-12px;
  right: 15px;
  border-style: solid;
  border-width: 0 12px 12px 12px;
  border-color: transparent transparent #161a1d transparent;
}
.settings-icon{
  width: 20px;
  height: 20px;
  margin-right:10px;
  -webkit-animation: spin 2s linear infinite; /* Safari 4.0 - 8.0 */
  animation: spin 2s linear infinite;
}
.settings-btn{
  width:75px;
  z-index: 2030;
}
.settings-btn.btn-bd-primary{
  background-color: #161a1d;
  color:#fff;
  border-color: #2d353c;
}
.settings-btn .settings-icon{
  display: block;
}
.settings-btn.active .settings-icon{
  display: none;
}
.settings-btn .settings-icon-close{
  display:none;
  width: 20px;
  height: 20px;
  margin-right:10px;
}
.rtl-layout .settings-btn.active .settings-icon-close{
  display:inline-block !important;
  margin-left:0px !important;
  margin-right:0px !important;
}
.settings-btn.active .settings-icon-close{
  animation: none;
  display: inline-block;
}
.dark-theme.marge-right-sidebar .settings-menu .panel-title{
  background-color: rgba(45, 53, 60, 0.95) !important;
  height:44px;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}
.settings-close{
  width: 15px;
  height: 15px;
}
@media (min-width: 990px) {
  .settings-menu{
    width: 1190px;
  }
}
/*
 * Navbar
 */
.sidebar-offcanvas.active .navbar{
  width: 100%;
  margin-left: 0px;
}
.sidebar .scroller{
  scrollbar-width: thin;
  border: none !important;
  border-style: none !important;
  background-color: transparent !important;
  scrollbar-color: #8383835e transparent !important;
  overflow: hidden;
  position: relative;
}
.sidebar-sticky .sidebar:hover .scroller{
  overflow-y: scroll !important;
  overflow-x: hidden;
}
.sidebar-sticky .sidebar:hover .scroller{
  margin-right: -10px !important;
  margin-left: 0px !important;
}
.rtl-layout.sidebar-sticky .sidebar:hover .scroller{
  margin-left: -11px !important;
  margin-right: 0px !important;
}
.sidebar-sticky .sidebar #menu .nav-item.mm-active a.has-arrow{
  background-color: rgba(255, 255, 255, 0.09) !important;
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.rtl-layout.sidebar-sticky .sidebar #menu .nav-item.mm-active a.has-arrow{
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.sidebar-sticky .sidebar #menu .nav-item.mm-active a.has-arrow::after{
  padding-left: 0px !important;
  margin-right: 8px !important;
}
.rtl-layout.sidebar-sticky .sidebar #menu .nav-item.mm-active a.has-arrow::after{
  padding-right: 0px !important;
  margin-left: 8px !important;
}
.rtl-layout.sidebar-sticky .sidebar #menu{
  margin-left: 0px !important;
}
.rtl-layout.sidebar-sticky .sidebar ul li ul{
  padding-right: 0px !important;
  margin-right: 25px !important;
}
.sidebar .scroller::-webkit-scrollbar {
  width: 10px;
  height: 0;
  background: transparent;
  background-color: transparent !important;
  display: none;
}
.sidebar .scroller::-webkit-scrollbar-thumb {
  background: transparent;
}
.mobile .sidebar .scroller::-webkit-scrollbar,
.mobile .sidebar .scroller:hover::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
.sidebar .scroller.scroller-vertical {
  overflow-y: auto;
  overflow-y: overlay;
}
.sidebar .scroller.scroller-horizontal {
  overflow-x: auto;
  overflow-x: overlay;
}
.top-nav-menu a,
.top-nav-menu div.search-bar,
.top-nav-menu div.language,
.top-nav-menu div.resources-box,
.top-nav-menu div.message-dropdown,
.top-nav-menu div.log-menu{
    font-size: 15px !important;
    display:inline-block;
}
.navbar .top-nav-menu a{
  text-decoration: none;
  color:inherit;
}
#sidebarMenu .offcanvas-body h6{
  font-weight: 500;
  padding: 0rem 1.3rem !important;
}
#menu .nav-item{
  text-decoration: none;
  width: 100%;
}
#menu li.nav-item a.has-arrow{
  font-weight: 500;
}
#menu .nav-item.mm-active a.has-arrow {
  background-color: rgba(255, 255, 255, 0.09);
  border-radius: .4375rem;
  font-weight: bold;
  box-shadow: none;
  color: #fff;
}
#menu .nav-item .nav-link.active i {
  color: inherit!important;
}
#menu li ul li {
  padding: 0px !important;
}
.sidebar ul li ul li:first-child:before {
  top: 0;
}
.sidebar ul li ul {
  color:#fff;
  padding-inline-start: 15px;
  z-index: 2009 !important;
}
.sidebar ul li ul li::before{
  content:'-⚬';
}
.sidebar ul li ul li {
  border-inline-start: 1px dashed #fff;
}
.sidebar ul li ul li a{
  display: inline-block;
}
.sidebar ul li ul li a{
  padding-left: 6px;
}
.navbar .top-nav-menu a .top-nav-icons{
  width:15px;
  height:15px;
  margin-left: 6px !important;
}
.navbar .top-nav-menu a .top-nav-icons.search-icon{
  width:14px;
  height:14px;
}
.navbar .top-nav-menu a .top-nav-icons.full-screen{
  display: inline-block;
  width:13px;
  height:13px;
}
.navbar .top-nav-menu a.active .top-nav-icons.full-screen{
  display: none;
}
.navbar .top-nav-menu a .top-nav-icons.exit-full-screen{
  display: none;
}
.navbar .top-nav-menu a.active .top-nav-icons.exit-full-screen{
  display: inline-block;
}
.navbar .top-nav-menu a .toggle-up-btn{
  width:15px;
  height:15px;
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.navbar .search-bar {
  width: auto;
  left: 0;
  position: relative;
  margin-bottom: auto;
  margin-top: auto;
  height: 20px;
  border-radius: 30px;
  padding: 0 0 0 0;
  font-size: 15px;
}
.navbar .search-input {
  color: #555;
  border: 0;
  outline: 0;
  background: none;
  width: 0;
  caret-color: transparent;
  line-height: 40px;
  transition: width 0.4s linear;
  color: #fff;
}
.navbar .search-bar:hover .search-input {
  padding: 0 10px;
  width: 40%;
  caret-color: rgb(204, 201, 201);
  transition: width 0.4s linear;
}
.navbar .search-bar .mic-bg{
  display: none;
  width: 26px;
  height: 25px;
  border-radius: 50%;
  background-color: #e6e6e6;
  color: #333;
  padding: 0px 1px;
}
.navbar .search-bar:hover .search-mic {
  width: 12px;
  height: 12px;
}
.navbar .search-bar:hover .mic-bg {
 display: inline-block;
}
.navbar .search-bar:hover>.search-icon {
  background: none;
  color: #777;
  font-size: 18px;
}
.navbar-brand .logo{
  width: 20px;
  height: 20px;
  float: left !important;
  margin-right: 1px;
}
.navbar-brand a{
  text-decoration: none !important;
}
.navbar-brand a strong{
  font-size: 1rem;
}
.navbar-brand a span{
  font-size: 1rem;
}
.navbar-brand strong{
  margin: 0px 5px 0px -15px;
}
.navbar-brand a .close-btn {
  width:16px;
  height:16px;
  margin-top: 4px;
  color: #fff !important;
  display: none;
  margin-right: -8px;
}
.sidebar-on-top .sidebar{
  border-right: 1px solid rgba(0, 0, 0, 0.5);
  box-shadow: 19px 0 19px -4px rgba(0, 0, 0, 0.5);
}
.navbar .form-control {
  padding: .75rem 1rem;
}
.navbar .dropdown-menu{
  left:auto;
  right:10px;
  margin-top: 20px;
}
.navbar .language .dropdown-menu{
  border: none;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.navbar .resources-box .dropdown-menu{
  border: none;
  width: 310px;
  height: 155px;
  padding: 15px 25px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  overflow: hidden;
}
.navbar .resources-box a:hover{
  border-radius: 12px;
}
.navbar .resources-box .resource-links a .brand-logos {
  width: 40px;
  height: 40px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.navbar .resources-box .resource-links a p{
  margin-bottom: 0px;
  padding-bottom: 0px;
  text-align: center;
}
.navbar .notifications {
  min-width: 310px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  border:none;
}
.navbar .notifications small,
.navbar .notifications .msg-date{
  color:#f6f6f67c !important;
}
.bg-white.navbar .notifications small,
.bg-white.navbar .notifications .msg-date{
  color:#0000007c !important;
}
.navbar .dropdown-messages,
.navbar .dropdown-alerts {
  padding: 10px 10px;
  border-radius: 6px;
  height: 270px;
  overflow-x: hidden;
  overflow-y: scroll;
  margin-bottom: 0px;
}
.navbar .notifications .notification-heading {
  padding: 10px 20px 10px 20px;
  border-bottom: 1px solid #f6f6f627;
}
.navbar .notifications .notification-heading h6 {
  font-size: 15px;
}
.navbar .dropdown-messages-box{
  float: left;
}
.navbar .notifications .dropdown-messages .media-body {
  font-size: 0.8rem;
  padding-top: 0px !important;
  padding-bottom: 8px !important;
  width: 270px;
  padding-left: 10px;
  margin-bottom: 0px !important;
  margin-top: 0px !important;
}
.navbar .notifications .dropdown-messages li .messages{
  display:none;
  position: fixed;
  width:400px;
  height:auto;
  top:46px !important;
  margin-left:-420px;
  border-radius: 10px;
  padding:20px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.rtl-layout .navbar .notifications .dropdown-messages li .messages{
  margin-left:auto;
  margin-right:-420px;
}
.navbar .notifications .dropdown-messages li .messages .media-body{
  padding-top:7px !important;
  width:100%;
  margin-bottom: 10px !important;
}
.navbar .notifications .dropdown-messages li .messages p{
  width:100%;
  clear: both;
}
.navbar .notifications .dropdown-messages li:hover .messages{
  display:block;
  background-color: inherit;
}
.navbar .notifications .img-circle {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  margin-left: 0;
  margin-right: 10px;
}
.navbar .notifications .notification-footer {
  padding: 10px 0 10px 20px;
  border-top: 1px solid #f6f6f627;
}
.navbar .notification-footer h6 {
  font-size: 15px;
}
.navbar .dropdown-messages li a,
.navbar .dropdown-alerts li a {
  font-size: 12px;
}
.navbar .dropdown-messages li em,
.navbar .dropdown-alerts li em {
  font-size: 10px;
}
.navbar .dropdown-notify {
  display: inline-block;
  margin-left: 20px;
  padding: 10px;
}
.navbar .message-dropdown .notify-icon-badge {
  position: absolute!important;
  top: -8px!important;
  left: 12px;
  font-size: .625rem;
}
.navbar .log-menu .user-profile-image {
  width: 35px;
  height: 35px;
}
.navbar .dropdown-logs{
  border:none;
  right:0px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.navbar .dropdown-logs a{
  font-size: 13px !important;
}
.navbar .dropdown-logs a .feather{
  width:20px;
  height:20px;
}
.mega-menu{
  display:none;
  width:100%;
  min-height:240px;
  height:auto;
  z-index: 2024;
  margin-top:8px !important;
  background-color: #fff !important;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  box-shadow: 0 14px 18px 0 rgba(0, 0, 0, 0.2), 0 16px 20px 0 rgba(0, 0, 0, 0.19);
}
.mega-menu.active{
  display:block !important;
}
.mega-menu.active .dropdown-menu{
  margin-top: 0px;
  position: static !important;
  display:block !important;
  box-shadow: none !important;
  border: none;
  padding: 0 auto;
}
.mega-menu.active .dropdown-menu a{
  padding:5px 0px;
}
.mega-menu.active .col-md-3{
  border-right:1px solid #eee;
}
.mega-menu.active .notifications{
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.mega-menu.active .notifications .dropdown-messages{
  height:220px;
}
.mega-menu.active .notifications .notification-footer{
  position: relative !important;
  padding: 10px 10px 0px 10px;
}
.mega-menu.active .resources-box .dropdown-menu {
    padding: 10px;
    height: auto;
}
.mega-menu.active .resources-box .dropdown-menu .resource-links{
  border:1px solid #eee;
}
.mega-menu.active .top-nav-menu.right-menu{
  display: none;
}
/*
* Nav and Background Colors
*/
.nav-bg-red{
  background-color: crimson;
}
/*
* BG & Text Colors
*/
.bg-red{
  background-color: crimson !important;
}
.bg-gray{
  background-color:#98a3b0 !important;
}
.bg-gray-light{
  --bs-bg-opacity: 1;
  background-color: rgba(237,241,246,var(--bs-bg-opacity))!important;
}
.bg-navy{
  background-color:#265689 !important;
}
.bg-ocean{
  background-color: #59b3f0 !important;
}
.bg-lime{
  background-color: #7abf1e !important;
}
.bg-violet{
  background-color: #b788f0 !important;
}
.bg-orange{
  background-color:#f9ab24 !important;
}
.bg-teal{
  background-color: #35cabc !important;
}
.bg-corn{
  background-color: #ffde2a !important;
}
.bg-cherry{
  background-color: #ec4d6c !important;
}
.bg-coffee{
  background-color: #ea916a !important;
}
.bg-pear{
  background-color: #d2649d !important;
}
.bg-night{
  background-color: #4b5158 !important;
}
/* Label Color */
.link-label{
  border-radius: 2px;
  padding: 1px 4px;
  margin-left: 10px;
  font-size: 11px;
  font-weight: 400;
}
.label-red{
  background-color: crimson;
  color: #fff;
}
.label-gray{
  background-color:#98a3b0;
  color: #fff;
}
.label-navy{
  background-color:#265689;
  color: #fff;
}
.label-ocean{
  background-color: #59b3f0;
  color: #fff;
}
.label-lime{
  background-color: #7abf1e;
  color: #fff;
}
.label-violet{
  background-color: #b788f0;
  color: #fff;
}
.label-orange{
  background-color:#f9ab24;
  color: #000000;
}
.label-teal{
  background-color: #35cabc;
  color: #000;
}
.label-corn{
  background-color: #ffde2a;
  color: #000;
}
.label-coffee{
  background-color: #ea916a;
  color: #000;
}
.label-pear{
  background-color: #d2649d;
  color: #fff;
}
.label-night{
  background-color: #4b5158;
  color: #fff;
}
/* Text Color */
.text-red{
  color: crimson !important;
}
.text-gray{
  color:#98a3b0 !important;
}
.text-navy{
  color:#265689 !important;
}
.text-ocean{
  color: #59b3f0 !important;
}
.text-lime{
  color: #7abf1e !important;
}
.text-violet{
  color: #b788f0 !important;
}
.text-orange{
  color:#f9ab24 !important;
}
.text-teal{
  color: #35cabc !important;
}
.text-corn{
  color: #ffde2a !important;
}
.text-cherry{
  color: #ec4d6c !important;
}
.text-coffee{
  color: #ea916a !important;
}
.text-pear{
  color: #d2649d !important;
}
.text-night{
  color: #4b5158 !important;
}
.text-dark{
  color: #333 !important;
}
/*
* Switchery Custom CSS
*/
.form-switch {
  padding-left: 2.6em;
}
.form-check {
  display: block;
  min-height: 1.125rem;
  padding-left: 1.75em;
  margin-bottom: .125rem;
}
.form-check-input[type=checkbox] {
  border-radius: .35em;
}
.form-switch .form-check-input:checked {
  background-color: #774ea7;
  border-color: #774ea7;
}
.form-switch .form-check-input {
  cursor: pointer;
  height: 1.35em;
  margin-top: 0;
  position: relative;
  top: .5625rem;
  transform: translateY(calc(-50% + 1px));
  transition: background .35s!important;
  user-select: none;
}
.form-check-input:checked {
  background-color: #774ea7;
  border-color: #774ea7;
}
.form-check-input[type=checkbox] {
  border-radius: 1.35em;
}
.form-check .form-check-input {
  float: left;
  margin-left: -1.75em;
}
.form-check-input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.form-check-input, .form-check-input:focus {
  transition: box-shadow .35s;
}
.ms-0 {
  margin-left: 0!important;
}
.form-check-input {
  width: 1.25em;
  height: 1.25em;
  margin-top: .125em;
  vertical-align: top;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border: 1px solid rgba(0,0,0,.2095);
  appearance: none;
}
/*
* Chart container
*/
/* Make the chart container responsive */
.chart-container {
  width: 100% !important; /* Full width of the parent */
  margin: 0 auto; /* Center the container */
  display:flex;
}
/* Custom CSS for ApexCharts menu */
.apexcharts-menu-item {
  color: #333 !important; /* White text */
}
.apexcharts-menu-item:hover {
  background-color: #eee !important; /* Darker background on hover */
}
/*
* Button & Color
*/
.color-circle-btn,
.color-header-btn,
.color-fullheader-btn,
.color-sidebar-btn,
.color-brand-btn,
.color-nav-btn,
.color-card-btn{
  width:25px;
  height: 25px;
  border-radius: 0px;
  border: none;
  margin: 2px;
}
.white-mode-btn{
  background-color: #fefefe !important;
  border:1px solid #dfdfdf;
  cursor: pointer;
}
.light-mode-btn{
  --bs-bg-opacity: 1;
  background-color: rgba(237,241,246,var(--bs-bg-opacity))!important;
  cursor: pointer;
}
.dark-mode-btn{
  background-color:#212127;
  cursor: pointer;
}
.dark-theme .input-group-text,
.dark-theme .sidebar .sidebar-menu-buttons .input-group-append button{
  background-color: #131313;
  color:#fff !important;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.dark-theme .sidebar .sidebar-menu-buttons .input-group-text{
  color:#fff !important;
}
.dark-theme .card{
  --bs-bg-opacity: 1;
  background-color: rgba(45,53,60, var(--bs-bg-opacity)) !important;
}
.dark-theme .text-muted {
  color:#b1b1b1 !important;
}
#radialBarBottom{
  padding: 0px;
  margin: 0px;
}
.color-box{
  width:40px;
  height:40px;
  border-radius: 6px;
}
.dark-theme .progress-text{
  color:#fff;
}
.dark-theme .navbar,
.dark-theme .navbar-brand{
  background-color: rgba(45, 53, 60, 0.95) !important;
  color:#e6e6e6;
}
.dark-theme .sidebar .user-panel {
  background: linear-gradient(rgba(218, 217, 217, 0.3), rgba(83, 83, 83, 0.35)), url(../img/profile-bg.jpg);
}
.dark-theme #menu .nav-item.mm-active a.has-arrow{
  background-color: rgb(29, 34, 39) !important;
  border-radius: 0px !important;
  margin: 0px !important;
}
.dark-theme .navbar .notifications .text-navy{
  color: #e6e6e6 !important;
}
.dark-theme .navbar .dropdown-messages::-webkit-scrollbar{
  scrollbar-width: thin;
}
.dark-theme .navbar .dropdown-messages::-webkit-scrollbar-thumb {
  background: rgba(99, 99, 99, 0.5) !important;
}
.dark-theme .navbar .notifications .notification-heading{
  border-bottom: 1px solid #212127 !important;
}
.dark-theme .navbar .notifications .notification-footer{
  border-top: 1px solid #212127 !important;
}
.navbar .dropdown-logs a:hover,
.navbar .language a:hover,
.navbar .top-nav-menu .resource-links a:hover{
  background-color: rgba(255, 255, 255, 0.2);
}
.navbar.bg-white .dropdown-logs a:hover,
.navbar.bg-white .language a:hover,
.navbar.bg-white .top-nav-menu .resource-links a:hover{
  background-color: #eeeeee61;
}
.dark-theme .navbar .dropdown-logs a:hover,
.dark-theme .navbar .language a:hover,
.dark-theme .navbar .top-nav-menu .resource-links a:hover{
  color:#f6f6f6;
  background-color: #575e6469 !important;
}
.dark-theme .sidebar{
  background-color: #2d353c !important;
}
.card{
  border-radius: 0px;
  height:100% !important;
  background-color: rgba(45, 53, 60, 0.95);
}
.card-header {
  --bs-body-color: hsla(0, 0%, 100%, 0.15);
  background-color: var(--bs-body-color);
  border-radius: 0px;
}
.card .card-body{
  border-radius: 0px;
}
.card .card-body p{
  font-size: 0.95rem;
}
.card .card-body .text-theme{
  color:inherit;
}
.dark-theme .card .card-body .text-theme{
    --bs-text-opacity: 1;
    color: rgba(var(--bs-warning-rgb),var(--bs-text-opacity))!important;
}
.card .card-header {
  font-size: .625rem;
  font-weight: 500;
}
.card-body {
  padding:0.625rem 0.625rem;
  overflow: hidden;
}
.light-theme .card{
  color:#fff !important;
}
.small-icon{
  width:15px;
  height:15px;
}
.large-icon{
  width:50px;
  height:50px;
}
.dark-theme .btn-share,
.dark-theme .btn-export,
.dark-theme .btn-display-report{
  background-color: #495057 !important;
  border-color: #363636 !important;
}
.dark-theme .navbar{
  background-color: rgba(45, 53, 60, 0.95) !important;
  color:#fff !important;
}
.dark-theme .navbar .search-bar .mic-bg{
  background-color: transparent;
  color: inherit;
}
.dark-theme .main-container,
.dark-theme .main-content{
  background-color: #161a1d !important;
}
.dark-theme .settings-btn{
  background-color: #1f1e1e !important;
  border: none;
  color:#fca105;
  box-shadow: inset 0px 0 1px 1px #fca105;
}
.dark-theme .settings-btn .settings-arrow:after{
  border-color: transparent transparent #fca105 transparent;
}
.dark-theme .settings-menu{
  background-color:rgba(45, 53, 60, 0.95) !important;
  color:#fff !important;
}
.dark-theme .settings-menu .text-night,
.dark-theme .settings-menu h6{
  color:#b6b4b4 !important;
  background-color: transparent !important;
  font-size: 14px !important;
  font-weight: 700!important;
}
.dark-theme .settings-menu .bg-gray-light{
  background-color:rgb(30, 36, 40) !important;
  color:#fff !important;
  box-shadow: inset 0px 1 0.69px 0.21px rgb(0, 0, 0);
}
.dark-theme .navbar .dropdown-menu{
  background-color: rgba(45, 53, 60, 0.95) !important;
  color:#e6e6e6;
}
.dark-theme .card .card-header{
  color:#fff;
}
.light-theme table,
.dark-theme table{
  border-color: #1d1d1d;
}
.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td{
  background-color: #fff;
  color:#333;
  border-color: #eee;
}
.daterangepicker .ranges li.active,
.applyBtn,
.applyBtn:hover{
  background-color: rgba(0, 0, 0, .55);
  color:#fff;
  border-color: #1d1d1d;
}
.light-theme table tr th,
.dark-theme table tr th{
  background-color: rgba(0, 0, 0, .55);
  color:#fff;
  border-color: #1d1d1d;
}
.light-theme table tr td,
.dark-theme table tr td{
  background-color: rgba(0, 0, 0, .15);
  color:#fff;
  border-color: #1d1d1d;
}
.breadcrumb {
  margin: 0;
  font-weight: 400;
  font-size: small;
}
.breadcrumb-item+.breadcrumb-item::before {
  float: left;
  padding-right: 0.5rem;
  color: #adb5bd;
  content: var(--bs-breadcrumb-divider, "/");
}
.breadcrumb .breadcrumb-item {
  line-height: 32.4px;
}
.breadcrumb .breadcrumb-item a {
  color: #97999b;
  text-decoration: none;
}
.dark-theme .breadcrumb .breadcrumb-item a {
  color: #dee2e6;
}
.breadcrumb-item.active {
  color: #6c757d;
}
.white-theme.marge-right-sidebar .settings-menu{
  background-color: #fff !important;
  color:#333 !important;
  box-shadow: none;
}
.white-theme .navbar{
  background-color: #fff !important;
  color:#555 !important;
}
.white-theme .user-panel h6,
.white-theme .user-panel p{
  color:#fff !important;
}
.white-theme .navbar-brand,
.white-theme .sidebar,
.white-theme .main-content,
.white-theme .card,
.white-theme .card-body,
.white-theme .card-header,
.white-theme .settings-menu h5{
  background-color: #fff !important;
  color:#555 !important;
  border-color: #eee !important;
  border-radius:0px;
}
.white-theme .navbar-brand span,
.white-theme .navbar-brand strong{
  color:#555 !important;
}
.white-theme .card {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 3px 20px 0 rgba(0, 0, 0, 0.1);
}
.white-theme .card .card-body p{
  color:inherit !important;
}
.white-theme .sidebar {
  border: 1px solid #eee;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
}

.white-theme .sidebar .sidebar-menu-buttons,
.white-theme .sidebar .sidebar-menu-buttons a{
  background-color: transparent;
  box-shadow: 0px 0px 14px rgba(204, 204, 204, 0.3)  inset;
  color:#555;
}
.white-theme .sidebar #menu a,
.white-theme .sidebar .scroller h6{
  color:#555;
}
.white-theme .sidebar #menu .mm-active a{
  color:#555;
}
.white-theme .input-group-text{
  background-color: #fff;
  color: #333;
}
.white-theme table th,
.white-theme table td{
  border-color: #d7d7d7 !important;
}
.white-theme .table-active{
  --bs-table-color-state: #333 !important;
  --bs-table-bg-state:#fff !important;
}
.card .card-body #total-sales .progress,
.card .card-body #total-sales .progress-bar,
.card .card-body #total-sales .progress-bar-striped {
  height: 0.4rem;
  font-size: 0.5625rem;
  border-radius: 4px;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
  color: #FFFFFF;
  background-color: rgba(var(32,37,42), var(1)) !important;
  transition: width 0.6s ease;
  display: flex;
  overflow: hidden;
}
.static-img{
  width:100%;
  min-height: auto;
  height: 160px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
.sidebar-widgets {
  margin-top: 10px;
  margin-bottom: 20px;
  display: none;
}
.sidebar-flat-menu .sidebar-widgets{
  display: block;
}
.sidebar-footer {
  width:14rem;
  height:1.9rem;
  color:#fff;
  position: absolute;
  top:auto;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 2px 0px;
}
.dark-theme.marge-right-sidebar .sidebar-footer{
  height: 32px;
  background-color: #2d353c !important;
  border-top:4px solid #131313;
}
.white-theme .sidebar-footer a{
  color:#161a1d !important;
}
.sidebar-footer a {
  font-size: 15px !important;
  text-decoration: none;
  color: #fefefe;
  margin: 6px 10px;
  display: inline-flex;
}
.sidebar-footer a svg{
  width:15px !important;
  height:15px !important;
}
.dark-theme .daterangepicker{
  margin-top:15px !important;
  background-color: #23272b !important;
}
.dark-theme .daterangepicker .calendar-table{
  background-color: #131313 !important;
  border:1px solid #000000 !important;
}
.dark-theme .daterangepicker td.off,
.dark-theme .daterangepicker td.off.in-range,
.dark-theme .daterangepicker td.off.start-date,
.dark-theme .daterangepicker td.off.end-date{
  background-color: #1d1d1d !important;
}
.dark-theme .daterangepicker td.active,
.dark-theme .daterangepicker td.active:hover{
  background-color: #747b81 !important;
}
.dark-theme .start-date,
.dark-theme .in-range,
.dark-theme .end-date{
  background-color: #131313 !important;
  color:#fff !important;
}
.dark-theme .daterangepicker td {
  color: #ffffff !important;
  background-color: #2e2d2d !important;
}
.dark-theme .daterangepicker{
  border:5px solid #484949 !important;
}
.dark-theme .daterangepicker.show-ranges.ltr .drp-calendar.left {
  border-left: 1px solid #2b2b2b !important;
}
.dark-theme .daterangepicker .drp-buttons{
  border-top: 1px solid #2d353c !important;
}
.dark-theme .daterangepicker select,
.dark-theme .daterangepicker select.hourselect,
.dark-theme .daterangepicker select.minuteselect,
.dark-theme .daterangepicker select.secondselect,
.dark-theme .daterangepicker select.ampmselect{
  background-color: #1d1d1d !important;
  border:3px solid #585858 !important;
  color:#fff !important;
}
/* Customize the entire scrollbar */
.dark-theme .daterangepicker select::-webkit-scrollbar {
  width: 6px; /* Width of the scrollbar */
}

/* Customize the track (background) of the scrollbar */
.dark-theme .daterangepicker select::-webkit-scrollbar-track {
  background: transparent !important; /* Color of the track */
}

/* Customize the draggable part of the scrollbar */
.dark-theme .daterangepicker select::-webkit-scrollbar-thumb {
  background: #5e5e5e !important; /* Color of the thumb */
  border-radius: 6px; /* Rounded corners */
}

/* Change the color of the thumb when hovered */
.dark-theme .daterangepicker select::-webkit-scrollbar-thumb:hover {
  background: #585858; /* Darker color on hover */
}

.dark-theme .daterangepicker .ranges li{
  color:#d3d3d3;
}
.dark-theme .daterangepicker .ranges li:hover{
  background-color: #474747;
  color:#e3e3e3;
}
.dark-theme .daterangepicker .ranges li.active {
  background-color: #474747;
  color: #e3e3e3;
}
.dark-theme .applyBtn,
.dark-theme .cancelBtn{
  background-color: #1d1d1d;
  color:#fff;
  border:3px solid #585858;
}
.dark-theme .daterangepicker .drp-buttons{
  color: #cecece;
}
.dark-theme .daterangepicker::before{
  top: -12px;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 12px solid #7e7e7e !important;
}
.dark-theme .daterangepicker::after {
  top: -11px;
  border-left: 11px solid transparent;
  border-right: 11px solid transparent;
  border-bottom: 11px solid #6d6d6d !important;
}
.scroll-up-btn{
  width:40px !important;
  height:40px;
  border-radius: 50%;
  z-index: 2099;
  padding:5px;
  font-weight:900;
  box-shadow: 4px 6px 8px rgba(0, 0, 0, 0.9);
  margin-left: 14rem !important;
  display:none;
  opacity: 0;
}
.scroll-up-btn.active{
  display:block !important;
  opacity: 1;
}
.dark-theme .scroll-up-btn{
  background-color: #161a1d;
  color:#fff;
  border-color:#525355;
  border-width: 2px;
  margin-left: 220px !important;
}
.footer{
  position: absolute;
  width: calc(100% - 14.10rem) !important;
  height: 1.9rem;
  color:#fff;
  left:0;
  bottom:0;
  margin-left: 14.10rem;
}
.light-theme .footer,
.white-theme .footer{
  background-color: transparent !important;
  color:#161a1d;
}
.dark-theme.marge-right-sidebar .footer{
  width: calc(100% - 28.54rem) !important;
  background-color: #2d353c !important;
  color:#fff !important;
  margin-left: 14.30rem;
}
.sidebar-on-top .sidebar {
  position: absolute !important;
  top: 0;
  left: 0;
  bottom: 0;
  z-index: 2999;
}
.sidebar-on-top.active .sidebar{
  display:none;
}
.sidebar-on-top .main-content{
  width:100% !important;
  margin-left: 0px !important;
  margin-right: 0px !important;
}
.sidebar-on-top .main-content .footer{
  width:calc(100% - 10px) !important;
  margin-left: 4px !important;
  margin-right: 5px !important;
}
.marge-right-sidebar .navbar #mega-menu-btn{
  display:none !important;
}
.marge-right-sidebar .settings-menu{
  width:13.99rem !important;
  position: absolute;
  top:0 !important;
  right:0;
  left:auto;
  z-index: 2009;
  padding: 0px 6px !important;
  margin-top: 0px !important;
  margin-bottom: 0px !important;
  overflow: hidden;
  height:100%;
}
.marge-right-sidebar h5{
  font-size: 16px !important;
}
.marge-right-sidebar h5 svg{
  width:18px;
  height:18px;
}
.extra-display{
  display: none !important;
}
.marge-right-sidebar .extra-display{
  display: block !important;
}
.marge-right-sidebar .settings-menu .col-lg-3,
.marge-right-sidebar .settings-menu .col-md-4,
.marge-right-sidebar .settings-menu .col-lg-6{
  width:100% !important;
  height:auto;
}
.marge-right-sidebar .settings-btn{
  display: none !important;
}
.marge-right-sidebar .settings-menu{
  display: block;
  min-height: 100%;
  height: fit-content;
}
.settings-btn.active{
  display:block !important;
  padding: 0 auto !important;
}
.white-theme tbody, 
.white-theme td, 
.white-theme tfoot, 
.white-theme th, 
.white-theme thead, 
.white-theme tr{
  background-color: #fff;
  border:1px solid #131313;
  color: #333 !important;
}
canvas {
  width: 100% !important;
  height: 100% !important;
}
#sales-over-time {
  width: 100% !important;
  max-width: 100%;
}
@keyframes push-sidebar-out {
  from {
      margin-left:14rem;
  }

  to {
      margin-left: -14rem !important;
  }
}
@keyframes sidebar-push-in {
  from {
      width: 0px;
      margin-left: -220px;
  }

  to {
      width: 220px;
      margin-left: 0px;
  }
}
.transparent{
  background-color: transparent !important;
}
.dark-theme .apexcharts-tooltip,
.dark-theme .apexcharts-tooltip-title,
.dark-theme .apexcharts-tooltip.apexcharts-theme-light{
  background-color: #333 !important;
  color:#fff !important;
  border-color: #98a3b0;
}
.dark-theme .daterangepicker .calendar-table th,
.dark-theme .daterangepicker .calendar-table td {
  background-color: #363636 !important;
  color: #fff !important;
  border-color: #484848 !important;
}
/* Email */

@media (max-width: 320px) {
  body {
    font-size: 14px !important; /* Smaller font size for better readability */
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:90vw !important;
    overflow-y: scroll !important;
    min-width: 260px;
    height:50vh;
    padding:25px 25px 25px 10px !important;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
}
@media (max-width: 575.98px) {
  .dropdown-menu{
    position:absolute !important;
    top:0px;
    width: 100vw !important;
    margin-top:10px !important;
    padding:5px !important;
  }
  .language .dropdown-menu{
    transform: translateX(26%);
  }
  .resources-box .dropdown-menu{
    transform: translateX(20%);
  }
  .message-dropdown .dropdown-menu{
    transform: translateX(12%);
  }
  .dropdown-logs.dropdown-menu{
    top:20px !important;
    transform: translateX(5%);
  }
  .rtl-layout .language .dropdown-menu{
    transform: translateX(-26%);
  }
  .rtl-layout .resources-box .dropdown-menu{
    transform: translateX(-20%);
  }
  .rtl-layout .message-dropdown .dropdown-menu{
    transform: translateX(-12%);
  }
  .rtl-layout .dropdown-logs.dropdown-menu{
    top:16px !important;
    transform: translateX(-8%);
  }
  .star{
    margin-top: -25px;
  }
  #barchart{
    min-height:340px;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .footer-cradits{
    display:none;
  }
  h1 {
    font-size: 24px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 20px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 14px; /* 16px */
    line-height: 1.8;
  }
  .settings-menu {
    width:80vw !important;
    overflow-y: scroll !important;
    min-width: 260px;
    height:50vh;
    padding:10px 25px 25px 10px;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
}
/* Styles for tablets and small devices */
@media (min-width: 320px) and (max-width: 768px) {
  .navbar-search {
    display: block;
  }
  .sidebar,
  .sidebar-offcanvas .sidebar {
    margin-left: 0px;
    position: fixed !important;
    box-shadow:-5px 0 10px rgba(0, 0, 0, 0.1), /* Left shadow */
    5px 0 10px rgba(0, 0, 0, 0.1); /* Right shadow */
    display:none;
    padding-bottom: 100px !important;
    height: 100vh;
  }
  .navbar-search {
    display: block;
  }
  .sidebar-offcanvas.active .toggle-full-screen,
  .sidebar-offcanvas.active .search-bar{
    display: none;
  }
  .active .sidebar{
    display:block !important;
    margin-left: 0px !important;
    z-index: 2999;
  }
  .rtl-layout.active .sidebar {
    display: block !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .sidebar .scroller{
    overflow-y: scroll;
    overflow-x: none;
    height:60vh;
    padding-bottom:40px;
  }
  .sidebar .sidebar-menu-buttons a{
    padding:0px;
    margin:5px 6px;
  }
  .navbar-brand a .close-btn{
    display: block;
    margin-top: 5px;
  }
  .top-nav-menu div.search-bar,
  .top-nav-menu a.toggle-full-screen{
    display: none;
  }
  .sidebar-widgets{
    padding: 10px !important;
    display:block !important;
  }
  .sidebar-footer{
    position:fixed;
    left:0;
    bottom:0;
    height:30px;
    background-color: inherit;
  }
  .marge-right-sidebar-btn {
    display:none !important;
  }
  .settings-menu .p-4{
    padding:0px 15px !important;
  }
  .footer{
    width: calc(100% - 8px);
    margin-left: 4px;
    margin-right: 4px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-menu .p-4{
    padding:10px 5px !important;
  }
  .settings-btn .settings-icon{
    margin: 0px 8px 0px 6px;
  }
  .fixed-header .navbar{
    width:100%;
  }
  .fixed-header .sidebar{
    z-index: 3124 !important;
  }
  h1 {
    font-size: 20px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 18px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 14px; /* 16px */
    line-height: 1.8;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:96vw !important;
    overflow-y: scroll;
    overflow-x: hidden;
    height:50vh;
    padding:10px 25px 25px 10px;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
  .btn-share,
  .btn-export{
    margin-bottom:2px;
  }
}
@media (min-width: 320px) and (max-width: 1200px){
  .sidebar-sticky .main-content,
  .rtl-layout.sidebar-sticky .main-content{
    width:100% !important;
    margin-left: 0rem !important;
    margin-right: 0rem !important;
    left: 0rem !important;
    right: 0rem !important;
  }
  .sidebar-sticky .main-content .footer,
  .rtl-layout.sidebar-sticky .main-content .footer{
    width:calc(100% - 10px) !important;
    margin:0px 6px 0px 4px;
  }
  .sidebar-sticky .sidebar .close-btn{
    display:block;
  }
  .rtl-layout.sidebar-sticky .main-content {
    margin-left: 0rem !important;
    margin-right: 0rem !important;
  }
  #push-sidebar,
  #top-sidebar,
  #fixed-sidebar,
  #make-static{
    display:none !important;
  }
  .navbar{
    padding:8px 10px;
  }
  .navbar .notifications .dropdown-messages li .messages{
    display:none !important;
  }
}
@media (max-width: 576px) {
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:86vw !important;
    overflow-y: scroll !important;
    min-width: 260px;
    height:50vh;
    padding:10px 10px 25px 25px;
  }
  .rtl-layout .settings-menu{
    padding:10px 25px 25px 10px !important;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
}
/* Styles for small laptops and large tablets */
@media (min-width: 769px) and (max-width: 1024px) {
  .navbar{
    padding:10px 10px 15px 10px !important;
  }
  .btn-share,
  .btn-export{
    margin-bottom:2px;
  }
  .settings-menu {
    overflow-y: scroll;
    overflow-x: hidden;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-menu .p-4{
    padding:10px 5px !important;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:95vw !important;
    min-width: 260px;
    overflow: none;
    padding:25px 10px 25px 25px !important;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
  .navbar-search {
    display: block;
  }
  .sidebar,
  .sidebar-offcanvas .sidebar {
    margin-left: 0px;
    position: fixed !important;
    box-shadow:-5px 0 10px rgba(0, 0, 0, 0.1), /* Left shadow */
    5px 0 10px rgba(0, 0, 0, 0.1); /* Right shadow */
    display:none;
    padding-bottom: 100px !important;
    height: 100vh;
  }
  .navbar-search {
    display: block;
  }
  .sidebar-offcanvas.active .toggle-full-screen,
  .sidebar-offcanvas.active .search-bar{
    display: none;
  }
  .active .sidebar{
    display:block !important;
    margin-left: 0px !important;
    z-index: 2999;
  }
  .rtl-layout.active .sidebar {
    display: block !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .sidebar .scroller{
    overflow-y: scroll;
    overflow-x: none;
    height:50vh !important;
    padding-bottom:40px;
  }
  .sidebar .sidebar-menu-buttons a{
    padding:0px;
    margin:5px 6px;
  }
  .navbar-brand a .close-btn{
    display: block;
    margin-top: 5px;
  }
  .top-nav-menu div.search-bar,
  .top-nav-menu a.toggle-full-screen{
    display: none;
  }
  .sidebar-widgets{
    display:block !important;
    padding:10px;
  }
  .sidebar-footer{
    position:fixed;
    left:0;
    bottom:0;
    height:30px;
    background-color: inherit;
  }
  .marge-right-sidebar-btn {
    display:none !important;
  }
  .settings-menu .p-4{
    padding:0px 15px !important;
  }
  .footer{
    width: calc(100% - 8px);
    margin-left: 4px;
    margin-right: 4px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-menu .p-4{
    padding:10px 5px !important;
  }
  .settings-btn .settings-icon{
    margin: 0px 8px 0px 6px;
  }
  .fixed-header .navbar{
    width:100%;
  }
  .fixed-header .sidebar{
    z-index: 3124 !important;
  }
  .rtl-layout .settings-menu{
    padding:10px 25px 5px 10px !important;
  }
}
@media (min-width: 600px) and (max-width: 800px){
  .settings-menu {
    width:92vw !important;
    overflow-y: scroll;
    overflow-x: hidden;
    height:auto;
    padding:10px 10px 25px 25px;
  }
  .footer {
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
  .sidebar,
  .sidebar-offcanvas .sidebar {
    margin-left: 0px;
    position: fixed !important;
    box-shadow:-5px 0 10px rgba(0, 0, 0, 0.1), /* Left shadow */
    5px 0 10px rgba(0, 0, 0, 0.1); /* Right shadow */
    display:none;
    padding-bottom: 100px !important;
    height: 100vh;
  }
  .navbar-search {
    display: block;
  }
  .sidebar-offcanvas.active .toggle-full-screen,
  .sidebar-offcanvas.active .search-bar{
    display: none;
  }
  .active .sidebar{
    display:block !important;
    margin-left: 0px !important;
    z-index: 2999;
  }
  .rtl-layout.active .sidebar {
    display: block !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .sidebar .scroller{
    overflow-y: scroll;
    overflow-x: none;
    height:45vh;
    padding-bottom:40px;
  }
  .sidebar .sidebar-menu-buttons a{
    padding:0px;
    margin:5px 6px;
  }
  .navbar-brand a .close-btn{
    display: block;
    margin-top: 5px;
  }
  .top-nav-menu div.search-bar,
  .top-nav-menu a.toggle-full-screen{
    display: none;
  }
  .sidebar-widgets{
    padding: 10px !important;
    display:block !important;
  }
  .sidebar-footer{
    position:fixed;
    left:0;
    bottom:0;
    height:30px;
    background-color: inherit;
  }
  .marge-right-sidebar-btn {
    display:none !important;
  }
  .settings-menu .p-4{
    padding:0px 15px !important;
  }
  .footer{
    width: calc(100% - 8px);
    margin-left: 4px;
    margin-right: 4px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-menu .p-4{
    padding:10px 5px !important;
  }
  .settings-btn .settings-icon{
    margin: 0px 8px 0px 6px;
  }
  .fixed-header .navbar{
    width:100%;
  }
  .fixed-header .sidebar{
    z-index: 3124 !important;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .rtl-layout .settings-menu{
    padding:10px 25px 5px 10px !important;
  }
}
@media (min-width: 768px) and (max-width: 1024px){
  .settings-menu {
    width:94vw !important;
    overflow-y: scroll;
    overflow-x: hidden;
    height:auto;
    padding:25px 15px 5px 25px;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
  .sidebar,
  .sidebar-offcanvas .sidebar {
    margin-left: 0px;
    position: fixed !important;
    box-shadow:-5px 0 10px rgba(0, 0, 0, 0.1), /* Left shadow */
    5px 0 10px rgba(0, 0, 0, 0.1); /* Right shadow */
    display:none;
    padding-bottom: 100px !important;
    height: 100vh;
  }
  .navbar-search {
    display: block;
  }
  .sidebar-offcanvas.active .toggle-full-screen,
  .sidebar-offcanvas.active .search-bar{
    display: none;
  }
  .active .sidebar{
    display:block !important;
    margin-left: 0px !important;
    z-index: 2999;
  }
  .rtl-layout.active .sidebar {
    display: block !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .sidebar .scroller{
    overflow-y: scroll;
    overflow-x: none;
    height:45vh;
    padding-bottom:40px;
  }
  .sidebar .sidebar-menu-buttons a{
    padding:0px;
    margin:5px 6px;
  }
  .navbar-brand a .close-btn{
    display: block;
    margin-top: 5px;
  }
  .top-nav-menu div.search-bar,
  .top-nav-menu a.toggle-full-screen{
    display: none;
  }
  .sidebar-widgets{
    padding: 10px !important;
    display:block !important;
  }
  .sidebar-footer{
    position:fixed;
    left:0;
    bottom:0;
    height:30px;
    background-color: inherit;
  }
  .marge-right-sidebar-btn {
    display:none !important;
  }
  .settings-menu .p-4{
    padding:0px 15px !important;
  }
  .footer{
    width: calc(100% - 8px);
    margin-left: 4px;
    margin-right: 4px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-menu .p-4{
    padding:10px 5px !important;
  }
  .settings-btn .settings-icon{
    margin: 0px 8px 0px 6px;
  }
  .fixed-header .navbar{
    width:100%;
  }
  .fixed-header .sidebar{
    z-index: 3124 !important;
  }
  h1 {
    font-size: 20px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 18px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 14px; /* 16px */
    line-height: 1.8;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .rtl-layout .settings-menu{
    padding:10px 25px 5px 10px !important;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
}
@media (min-width: 800px) and (max-width: 1025px) {
  h1 {
    font-size: 16px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 14px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 12px; /* 16px */
    line-height: 1.8;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:95vw !important;
    overflow-y: scroll;
    overflow-x: hidden;
    height:auto;
    padding:25px 25px 0px 25px;
  }
  .dark-theme .settings-menu .bg-gray-light{
    background-color: transparent !important;
  }
  .sidebar,
  .sidebar-offcanvas .sidebar {
    margin-left: 0px;
    position: fixed !important;
    box-shadow:-5px 0 10px rgba(0, 0, 0, 0.1), /* Left shadow */
    5px 0 10px rgba(0, 0, 0, 0.1); /* Right shadow */
    display:none;
    padding-bottom: 100px !important;
    height: 100vh;
  }
  .navbar-search {
    display: block;
  }
  .sidebar-offcanvas.active .toggle-full-screen,
  .sidebar-offcanvas.active .search-bar{
    display: none;
  }
  .active .sidebar{
    display:block !important;
    margin-left: 0px !important;
    z-index: 2999;
  }
  .rtl-layout.active .sidebar {
    display: block !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .sidebar .scroller{
    overflow-y: scroll;
    overflow-x: none;
    height:50vh;
    padding-bottom:40px;
  }
  .sidebar .sidebar-menu-buttons a{
    padding:0px;
    margin:5px 6px;
  }
  .navbar-brand a .close-btn{
    display: block;
    margin-top: 5px;
  }
  .top-nav-menu div.search-bar,
  .top-nav-menu a.toggle-full-screen{
    display: none;
  }
  .sidebar-widgets{
    padding: 10px !important;
    display:none !important;
  }
  .sidebar-footer{
    position:fixed;
    left:0;
    bottom:0;
    height:30px;
    background-color: inherit;
  }
  .marge-right-sidebar-btn {
    display:none !important;
  }
  .settings-menu .p-4{
    padding:0px 15px !important;
  }
  .footer{
    width: calc(100% - 8px);
    margin-left: 4px;
    margin-right: 4px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-menu .p-4{
    padding:10px 5px !important;
  }
  .settings-btn .settings-icon{
    margin: 0px 8px 0px 6px;
  }
  .fixed-header .navbar{
    width:100%;
  }
  .fixed-header .sidebar{
    z-index: 3124 !important;
  }
  h1 {
    font-size: 20px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 18px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 14px; /* 16px */
    line-height: 1.8;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
}
/* Styles for desktops and large screens */
@media (min-width: 1025px) and (max-width: 1200px) {
  h1 {
    font-size: 18px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 15px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 12px; /* 16px */
    line-height: 1.8;
  }
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:96vw;
  }
  .sidebar,
  .sidebar-offcanvas .sidebar {
    margin-left: 0px;
    position: fixed !important;
    box-shadow:-5px 0 10px rgba(0, 0, 0, 0.1), /* Left shadow */
    5px 0 10px rgba(0, 0, 0, 0.1); /* Right shadow */
    display:none;
    padding-bottom: 100px !important;
    height: 100vh;
  }
  .navbar-search {
    display: block;
  }
  .sidebar-offcanvas.active .toggle-full-screen,
  .sidebar-offcanvas.active .search-bar{
    display: none;
  }
  .active .sidebar{
    display:block !important;
    margin-left: 0px !important;
    z-index: 2999;
  }
  .rtl-layout.active .sidebar {
    display: block !important;
    margin-left: auto !important;
    margin-right: 0 !important;
  }
  .sidebar .scroller{
    overflow-y: scroll;
    overflow-x: none;
    height:60vh;
    padding-bottom:40px;
  }
  .sidebar .sidebar-menu-buttons a{
    padding:0px;
    margin:5px 6px;
  }
  .navbar-brand a .close-btn{
    display: block;
    margin-top: 5px;
  }
  .top-nav-menu div.search-bar,
  .top-nav-menu a.toggle-full-screen{
    display: none;
  }
  .sidebar-widgets{
    padding: 10px !important;
    display:block !important;
  }
  .sidebar-footer{
    position:fixed;
    left:0;
    bottom:0;
    height:30px;
    background-color: inherit;
  }
  .marge-right-sidebar-btn {
    display:none !important;
  }
  .footer{
    width: calc(100% - 8px);
    margin-left: 4px;
    margin-right: 4px;
  }
  .rtl-layout .footer{
    width:calc(100% - 9px) !important;
    margin-left:6px !important;
    margin-right:6rem !important;
  }
  .panel-title{
    margin: 0px;
    top:-20px;
    left:0;
    right:0;
    padding: 0px !important;
    font-size: 14px !important;
  }
  .panel-title .feather-settings{
    width:16px;
    height:16px;
  }
  .settings-btn .settings-icon{
    margin: 0px 8px 0px 6px;
  }
  .fixed-header .navbar{
    width:100%;
  }
  .fixed-header .sidebar{
    z-index: 3124 !important;
  }
  h1 {
    font-size: 20px; /* 28px */
    line-height: 1.3;
  }
  h2 {
    font-size: 18px; /* 24px */
    line-height: 1.4;
  }
  p {
    font-size: 14px; /* 16px */
    line-height: 1.8;
  }
  /* Mega menu responsive styles moved to mega-menu-responsive.css */
  .dashboard-breadcrumb .justify-content-center,
  .dashboard-breadcrumb .justify-content-end{
    float:left !important;
    right:auto !important;
    left:0 !important;
    text-align: left !important;
    justify-content: left !important;
  }
  #marge-right-sidebar-btn{
    visibility: hidden !important;
  }
  .settings-menu {
    width:96vw !important;
    overflow-y: scroll;
    overflow-x: hidden;
    height:auto;
  }
  .footer{
    width: calc(100% - 9px);
    margin-left: 4px;
    margin-right: 5px;
  }
  .rtl-layout .settings-menu{
    padding:0px 25px 0px 10px !important;
  }
  .settings-menu .col- > *{
    padding:50px !important;
  }
}
/* Styles for extra large screens */
@media (min-width: 1201px) {
  body {
      font-size: 12px;
  }
}
@media screen and (min-width: 1366px) and (max-width: 1919px) {
  .large-icon{
      width: 40px;
      height: 40px;
  }
}
@media screen and (max-width: 1024px) and (min-width: 1366px) {
  .large-icon{
      width: 50px;
      height: 50px;
  }
}
/* Portrait Mode */
@media (orientation: portrait) {
  body {
    /* background-color: lightblue; */
    font-size: 14px;
  }
  .sidebar ul li ul {
    padding-inline-start: 15px;
  }
}
/* Landscape Mode for Macbook / Notebook */
@media (orientation: landscape) {
  body{
    font-size: 17px;
  }
  .sidebar-flat-menu {
    font-size: 16px;
  }
}
/* High-Resolution Displays (Retina) */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body {
    font-size: 1.2em;
  }
}
@media print {
  body {
    font-size: 12pt;
    color: black;
  }
  /* Hide unnecessary elements */
  .no-print {
    display: none;
  }
}
:root {
            --primary-color: #00f0ff;
            --secondary-color: #7b2cbf;
            --dark-bg: #0a0a1a;
            --card-bg: #15152b;
        }
        .visitor-item {
            display: flex;
            align-items: center;
            padding: 2px 12px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.05);
            transition: all 0.3s ease;
        }
        
        .visitor-item:hover {
            background-color: #ffffff10;
            transform: translateX(5px);
            border-radius: 15px;
            padding: 5px 8px;
            margin-left: -10px;
        }
        
        .country-flag {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            object-fit: cover;
            margin-right: 15px;
            box-shadow: 0 0 10px rgba(0, 240, 255, 0.3);
            border: 2px solid var(--primary-color);
        }
        
        .country-info {
            flex-grow: 1;
        }
        
        .country-name {
            font-weight: 400;
            margin-bottom: 3px;
            letter-spacing: 0.5px;
            font-size: 12px;
        }
        
        .visitor-count {
            font-size: 0.55rem;
            color: #aaa;
        }
        
        .percentage-bar {
            height: 8px;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 4px;
            margin-top: 5px;
            overflow: hidden;
        }
        
        .percentage-fill {
            height: 100%;
            background: linear-gradient(90deg, var(--secondary-color), var(--primary-color));
            border-radius: 4px;
            transition: width 1s ease;
        }
        
        .percentage-value {
            min-width: 50px;
            text-align: right;
            font-weight: 700;
            color: var(--primary-color);
            margin-left: 15px;
            font-feature-settings: "tnum";
            font-variant-numeric: tabular-nums;
        }
        
        .glow-effect {
            position: absolute;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            background: radial-gradient(circle at center, rgba(0, 240, 255, 0.1) 0%, transparent 70%);
            pointer-events: none;
        }
.document-btn,
.load-more-btn {
    --bs-body-color: hsla(0, 0%, 100%, 0.15);
    background-color: var(--bs-body-color);
}
.white-theme .document-btn{
  color: #fff;
    background-color: #646464;
}
.visitor-map{
  position: relative;
  width:100%;
  height:fit-content;
}
.visitor-map:before{
    z-index:-1;
    position:absolute;
    background-position: center;
    background-size: cover;
    left:-300px;
    top:0;
    content: url('../img/pexels-pixabay-earth-image.jpg');
    opacity:0.19;
}
.jvectormap-region.jvectormap-selected {
  stroke: #333 !important;
  stroke-width: 2px;
  fill: #0A6EB4 !important;
  background-color: #fff !important;
}
.advanced-glow {
  position: relative;
  animation: advanced-glow 3s ease-in-out infinite alternate;
}
.white-theme .advanced-glow,
.white-theme .advanced-glow::before {
  animation: none;
}
.jvectormap-marker .jvectormap-element .advanced-glow::before {
  content: '';
  position: absolute;
  top: -10px;
  left: -10px;
  right: -10px;
  bottom: -10px;
  background: inherit;
  border-radius: inherit;
  filter: blur(20px);
  opacity: 0.7;
  z-index: -1;
  animation: background-glow 1s ease-in-out infinite alternate;
}

@keyframes advanced-glow {
  0% {
    filter: brightness(1) drop-shadow(0 0 10px #383838);
  }
  50% {
    filter: brightness(1.9) drop-shadow(0 0 10px #b3ff00);
  }
  100% {
    filter: brightness(1) drop-shadow(0 0 10px #383838);
  }
}
@keyframes background-glow {
  from {
    opacity: 0.3;
    transform: scale(1.1);
  }
  to {
    opacity: 0.7;
    transform: scale(1.2);
  }
}
.filter-glow {
  animation: filter-glow 2s ease-in-out infinite alternate;
}

@keyframes filter-glow {
  0% {
    filter: brightness(1) drop-shadow(0 0 5px rgba(255, 255, 255, 0.5));
  }
  100% {
    filter: brightness(1.2) drop-shadow(0 0 20px rgba(0, 255, 255, 0.8)) 
            drop-shadow(0 0 30px rgba(0, 255, 255, 0.6));
  }
}
.neon-border {
  border: 2px solid #fff;
  border-radius: 10px;
  animation: neon-border 1.5s ease-in-out infinite alternate;
}

@keyframes neon-border {
  from {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #08f, 0 0 20px #08f;
    border-color: #08f;
  }
  to {
    box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #08f, 0 0 40px #08f;
    border-color: #0ff;
  }
}
.hover-glow {
  transition: all 0.3s ease;
}

.hover-glow:hover {
  box-shadow: 0 0 20px #00ffea, 0 0 30px #00ffea, 0 0 40px #00ffea;
  transform: scale(1.05);
}
.rainbow-glow {
  animation: rainbow-glow 3s linear infinite;
}

@keyframes rainbow-glow {
  0% {
    filter: drop-shadow(0 0 10px #ff0000);
  }
  25% {
    filter: drop-shadow(0 0 15px #00ff00);
  }
  50% {
    filter: drop-shadow(0 0 20px #0000ff);
  }
  75% {
    filter: drop-shadow(0 0 15px #ffff00);
  }
  100% {
    filter: drop-shadow(0 0 10px #ff0000);
  }
}
.glow-image {
  animation: glow 2s ease-in-out infinite alternate;
}

@keyframes glow {
  from {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #e60073, 0 0 20px #e60073;
  }
  to {
    box-shadow: 0 0 10px #fff, 0 0 20px #ff4da6, 0 0 30px #ff4da6, 0 0 40px #ff4da6;
  }
}
.percentage-value-pw {
  position: relative;
  right: 0px;
}
.marge-right-sidebar .settings-menu h6{
  margin: 10px 0px !important;
}
.dark-theme.marge-right-sidebar .settings-menu h6,
.dark-theme.marge-right-sidebar .settings-menu h5{
  color:#fff !important;
  font-size: 13px !important;
}
.dark-theme.marge-right-sidebar .form-check-label{
  color:rgb(216, 216, 216)!important;
  font-weight: 400;
}
.marge-right-sidebar .settings-menu .col-xl-3
.marge-right-sidebar .settings-menu .col-lg-3,
.marge-right-sidebar .settings-menu .col-md-6,
.marge-right-sidebar .settings-menu .col-sm-6,
.marge-right-sidebar .settings-menu .col-12,
.marge-right-sidebar .settings-menu .p-4{
  padding-top: 16px !important;
  padding-bottom: 5px !important;
}
.marge-right-sidebar .themes-btn{
  padding: 0px !important;
  margin: 0px !important;
}
.dark-theme .sidebar-widgets .bg-gray-light{
  background-color: hsla(0, 0%, 100%, 0.15) !important;
  color:#fff !important;
}
#notify{
  overflow: hidden;
}
#notify .notify-icon-badge {
  position: absolute;
  margin-left:-13px;
  font-size: 0.625rem;
  width: 10px !important;
  height: 10px !important;
  border:1px solid #fff;
}
.ringing {
    animation: ring 0.5s ease-in-out infinite alternate;
}
@keyframes ring {
    0% { transform: rotate(-15deg); }
    100% { transform: rotate(15deg); }
}
/* Animation 5: Spin */
.spin {
    animation: spin 3s linear infinite;
}
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.typewriter {
    border-right: 2px solid #00d4ff;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 3.7s alternate-reverse infinite;
}
.typewriter-2 {
    border-right: 2px solid #00d4ff;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 7s alternate infinite;
}
.typewriter-3 {
    border-right: 2px solid #00d4ff;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 4s alternate infinite;
}
.typewriter-4 {
    border-right: 2px solid #00d4ff;
    white-space: nowrap;
    overflow: hidden;
    animation: typing 8s alternate infinite;
}
@keyframes typing {
    from { width: 0%; margin-left: -10.7px; }
    to { width: 100%; margin-left: 0px; }
}
@keyframes blink-caret {
    from, to { border-color: transparent }
    50% { border-color: #00d4ff; }
}
/* Typewriter 1: Classic Typewriter */
.typewriter-1 {
    border-right: 2px solid #00d4ff;
    white-space: nowrap;
    overflow: hidden;
    animation: typing-1 7s steps(40, end) infinite;
}
@keyframes typing-1 {
    from { width: 0 }
    to { width: 100% }
}
.dark-theme .sidebar h6{
animation: colorChange 0.75s ease infinite alternate-reverse;
}
.dark-theme .change-colors{
  animation: rainbow-glow 3s infinite, colorChange 2s ease infinite alternate-reverse;
}
@keyframes colorChange {
    from { color: rgba(255,193,7); }
    to { color: #ffffff; }
}
.dark-theme.marge-right-sidebar .badge.bg-warning{
  color:black;
  font-size: 10px;
  margin: 4px 0px;
}
 /* Effect 1: Classic Typewriter */
        .typewriter-1 {
            overflow: hidden;
            border-right: 2px solid #00d4ff;
            white-space: nowrap;
            animation: typing-1 3s steps(40, end), blink-caret 0.75s step-end infinite;
        }

        @keyframes typing-1 {
            from { width: 0 }
            to { width: 100% }
        }

        /* Effect 2: Character by Character */
        .typewriter-2 {
            white-space: nowrap;
            overflow: hidden;
        }

        .typewriter-2 span {
            display: inline-block;
            opacity: 0;
            animation: type-char 0.1s forwards;
        }

        .typewriter-2 span:nth-child(1) { animation-delay: 0.1s; }
        .typewriter-2 span:nth-child(2) { animation-delay: 0.2s; }
        .typewriter-2 span:nth-child(3) { animation-delay: 0.3s; }
        .typewriter-2 span:nth-child(4) { animation-delay: 0.4s; }
        .typewriter-2 span:nth-child(5) { animation-delay: 0.5s; }
        .typewriter-2 span:nth-child(6) { animation-delay: 0.6s; }
        .typewriter-2 span:nth-child(7) { animation-delay: 0.7s; }
        .typewriter-2 span:nth-child(8) { animation-delay: 0.8s; }
        .typewriter-2 span:nth-child(9) { animation-delay: 0.9s; }
        .typewriter-2 span:nth-child(10) { animation-delay: 1.0s; }
        .typewriter-2 span:nth-child(11) { animation-delay: 1.1s; }
        .typewriter-2 span:nth-child(12) { animation-delay: 1.2s; }
        .typewriter-2 span:nth-child(13) { animation-delay: 1.3s; }
        .typewriter-2 span:nth-child(14) { animation-delay: 1.4s; }
        .typewriter-2 span:nth-child(15) { animation-delay: 1.5s; }
        .typewriter-2 span:nth-child(16) { animation-delay: 1.6s; }
        .typewriter-2 span:nth-child(17) { animation-delay: 1.7s; }
        .typewriter-2 span:nth-child(18) { animation-delay: 1.8s; }
        .typewriter-2 span:nth-child(19) { animation-delay: 1.9s; }
        .typewriter-2 span:nth-child(20) { animation-delay: 2.0s; }

        @keyframes type-char {
            to { opacity: 1; }
        }

        /* Effect 3: Fade In Words */
        .fade-words span {
            opacity: 0;
            animation: fade-word 0.8s forwards;
        }

        .fade-words span:nth-child(1) { animation-delay: 0.3s; }
        .fade-words span:nth-child(2) { animation-delay: 0.6s; }
        .fade-words span:nth-child(3) { animation-delay: 0.9s; }
        .fade-words span:nth-child(4) { animation-delay: 1.2s; }
        .fade-words span:nth-child(5) { animation-delay: 1.5s; }

        @keyframes fade-word {
            to { opacity: 1; }
        }

        /* Effect 4: Slide Up */
        .slide-up span {
            display: inline-block;
            opacity: 0;
            transform: translateY(30px);
            animation: slide-up 0.5s forwards;
        }

        .slide-up span:nth-child(1) { animation-delay: 0.1s; }
        .slide-up span:nth-child(2) { animation-delay: 0.2s; }
        .slide-up span:nth-child(3) { animation-delay: 0.3s; }
        .slide-up span:nth-child(4) { animation-delay: 0.4s; }
        .slide-up span:nth-child(5) { animation-delay: 0.5s; }
        .slide-up span:nth-child(6) { animation-delay: 0.6s; }
        .slide-up span:nth-child(7) { animation-delay: 0.7s; }
        .slide-up span:nth-child(8) { animation-delay: 0.8s; }
        .slide-up span:nth-child(9) { animation-delay: 0.9s; }
        .slide-up span:nth-child(10) { animation-delay: 1.0s; }

        @keyframes slide-up {
            to { opacity: 1; transform: translateY(0); }
        }

        /* Effect 5: Glitch Text */
        .glitch-text {
            position: relative;
            animation: glitch 0.5s infinite;
        }

        @keyframes glitch {
            0% { transform: translate(0); }
            20% { transform: translate(-2px, 2px); }
            40% { transform: translate(-2px, -2px); }
            60% { transform: translate(2px, 2px); }
            80% { transform: translate(2px, -2px); }
            100% { transform: translate(0); }
        }

        /* Effect 6: Matrix Rain */
        .matrix-text {
            color: #00ff88;
            text-shadow: 0 0 10px #00ff88;
            animation: matrix 0.1s infinite;
        }

        @keyframes matrix {
            0% { opacity: 1; }
            50% { opacity: 0.7; }
            100% { opacity: 1; }
        }

        /* Effect 7: Bounce In */
        .bounce-in span {
            display: inline-block;
            opacity: 0;
            transform: scale(0.3);
            animation: bounce-in 0.6s forwards;
        }

        .bounce-in span:nth-child(1) { animation-delay: 0.1s; }
        .bounce-in span:nth-child(2) { animation-delay: 0.2s; }
        .bounce-in span:nth-child(3) { animation-delay: 0.3s; }
        .bounce-in span:nth-child(4) { animation-delay: 0.4s; }
        .bounce-in span:nth-child(5) { animation-delay: 0.5s; }

        @keyframes bounce-in {
            0% { opacity: 0; transform: scale(0.3); }
            50% { opacity: 1; transform: scale(1.1); }
            70% { transform: scale(0.9); }
            100% { opacity: 1; transform: scale(1); }
        }

        /* Effect 8: Color Change */
        .color-change {
            background: linear-gradient(90deg, #6a11cb, #2575fc, #00d4ff, #ff0080, #00ff88);
            background-size: 500% 100%;
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            animation: color-shift 3s ease-in-out infinite;
        }

        @keyframes color-shift {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }

        /* Blinking Cursor */
        @keyframes blink-caret {
            from, to { border-color: transparent }
            50% { border-color: #00d4ff; }
        }
.typing-text {
            color: #00d4ff;
            overflow: hidden;
            border-right: 3px solid #00d4ff;
            border-radius: 100%;
            white-space: nowrap;
            animation: typing-left 2s infinite, blink-caret .75s step-end infinite;
        }

        @keyframes typing-left {
            from { width: 0 }
            to { width: 50% }
        }

        @keyframes blink-caret {
            from, to { border-color: transparent; box-shadow:0 0 1px #00d4ff }
            50% { border-color: #00d4ff; box-shadow:0 1 0px #00d4ff; }
        }
.icon { animation: shake 0.5s ease-in-out infinite; }
@keyframes shake { 0%,100% {transform:translateX(0);} 25% {transform:translateX(-1px);} 75% {transform:translateX(1px);} }
.blink { animation: blink 1s infinite alternate; } @keyframes blink { to { opacity: 0; } }
.sidebar a span.link-label{
animation: blink 0.75s ease-in-out infinite alternate; } @keyframes blink { to { opacity: 0; }
}
.dark-theme .sidebar-widgets h5{
  color:#fff !important;
}
.dark-theme .footer{
  width:calc(100% - 14.65rem) !important;
  background-color: #2d353c;
  margin-left: 14.3rem;
}
.light-theme .sidebar-footer{
  border-top:0px;
}
.dark-theme .sidebar-footer{
  height: 33px;
  padding-bottom: 4px;
  border-top:4px solid #161a1d;
}
.spark { border:2px solid #00d4ff; background:linear-gradient(90deg,transparent,#00d4ff,transparent); background-size:200% 100%; animation:spark 2s linear infinite; } @keyframes spark { to {background-position:200% 0} }
.light { border:2px solid; background:linear-gradient(90deg,transparent,white,transparent); background-size:200% 100%; animation:light 2s linear infinite; } @keyframes light { from {background-position:-200% 0} to {background-position:200% 0} }
.flow-text{overflow:hidden;white-space:nowrap;background:linear-gradient(90deg,transparent,#b3ff00,transparent);background-size:100% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:type 3s steps(40) infinite,flow 1s linear infinite}@keyframes type{from{width:0}to{width:100%}}@keyframes flow{from{background-position:-100% 0}to{background-position:100% 0}}