/* design alps dha*/

.navbar-semi-dark .navbar-header {
  background: #ffffff;
}

.navbar-semi-dark .navbar-header .brand-text {
  color: #6B6F82;
}

.color11 {
  background-color: #ffedd9 !important;
  color: black !important;
  border-radius: 7px;
}

.color12 {
  background-color: #d2edff !important;
  color: black !important;
  border-radius: 7px;
}

.color13 {
  background-color: #f5ece8 !important;
  color: black !important;
  border-radius: 7px;
}

.color14 {
  background-color: #daedf9 !important;
  color: black !important;
  border-radius: 7px;
}

.color15 {
  color: #e91e63 !important;
}

.color16 {
  color: #9677de !important;
}

.color17 {
  color: #f7bc31 !important;
}

.color18 {
  color: #666ee8 !important;
}

.color19 {
  color: #fafb15 !important;
}

.color20 {
  color: #FF4961 !important;
}

.color21 {
  color: #FF8A80 !important;
}

.media.d-flex .media-body.text-left h3 {
  font-size: 18px;
}

#chartjs-line-charts {
  width: 100%;
}

.profiledha {
  width: 100%;
  color: black;
}

.profiledha tr {
  border-bottom: 1px solid #e8e8e8;
}

.profiledha th {
  font-size: 13px;
  width: 50%;
  padding: 15px 0;
}

.profiledha td {
  font-size: 13px;
}

.card-content {
  text-align: center;
}

.card-content .img-fluid {
  width: 98px;
  height: 98px;
  border-radius: 50px;
  border: 5px solid #fff;
}

.card-content .img-fluid-red {
  width: 98px;
  height: 98px;
  border-radius: 50px;
  border: 5px solid red;
}

.card-content .img-fluid-blue {
  width: 98px;
  height: 98px;
  border-radius: 50px;
  border: 5px solid #01a9ac;
}

.card-content .img-fluid-green {
  width: 98px;
  height: 98px;
  border-radius: 50px;
  border: 5px solid #35c033;
}

.main-menu.menu-dark .navigation>li {
  padding: 0;
  border-bottom: 1px solid #efefef;
}

.main-menu.menu-dark .navigation {
  background: transparent;
}

.main-menu.menu-dark {
  color: #707486;
  background: #ffffff;
}

.main-menu.menu-dark .navigation li a {
  color: #fff;
}

.main-menu.menu-dark .navigation>li.active>a {
  color: #ffffff;
  font-weight: 700;
  /*background: #055eaf;*/
  background: #63991a;
}

.card.pull-up .card-content {
  text-align: center;
  border: 1px solid #b6d0e7;
  border-radius: 4px;
}

.card.pull-up .card-content .card-body {
  padding: 1.0rem;
  height: 92px;
}

.main-menu.menu-dark .navigation>li.open>a {
  color: #ffffff !important;
  /*background: #90c202;
    border-right: 4px solid #90c202;;*/
  background: #323232c2;
  border-right: 4px solid rgba(255, 255, 255, 0.5);
}

.main-menu.menu-dark .navigation>li>ul {
  background: #eeeeee;
}

/*.header-navbar .navbar-header .navbar-brand .brand-logo{
	width:auto;
	}*/
.card.carddha .card-header {
  background: transparent;
  padding: 20px 15px;
  text-align: left;
}

.carddha .card-body {
  padding: 15px;
  text-align: left;
}


.carddha {
  background: url(../images/admin-bg.jpg);
  background-size: cover;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  -o-border-radius: 5px;
  border-radius: 5px;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 0;
}

.carddha::before {
  background: #fff none repeat scroll 0 0;
  content: "";
  height: 100%;
  left: 0;
  opacity: 0.8;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.carddha:after {
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

/*.navbar-header .brand-logo.baa{display:none; visibility:hidden; opacity:0;}
.navbar-header.expanded .brand-logo.saa{display:none; visibility:hidden;  opacity:0;}*/
.carda {
  margin-bottom: 30px;
  height: auto !important;
}

.header-navbar .navbar-header .navbar-brand .brand-logo {
  height: auto !important;
  position: relative;
  top: -38px;
  width: 130px;
}

.rewordlinecolor {
  width: 100%;
  position: relative;
}

.reword2dha {
  width: 100%;
  float: left;
  margin-bottom: 40px;
}

.tooltipw {
  position: absolute;
  top: 30px;
  left: 0px;
  border-radius: 5px !important;
}

.rewadline1 {}

.toplineborder {
  background: #1e9ff2;
  border-radius: 0px 0px 0px 0px;
  position: relative;
  text-align: right;
}

.rewordlinecolor .col-sm-3 {
  padding: 0px;
}

.toplinetext {
  width: 100%;
  border-right: 1px solid #dcdcdc;
  float: left;
  padding: 10px 4px;
  border-bottom: 1px solid #dcdcdc;
}

.toplinetext2 {
  width: 100%;
  float: left;
  border-right: 1px solid #dcdcdc;
}

.toplinetext2 h4 {
  text-align: center;
  font-size: 13px;
  padding-top: 10px;
}

.toplinetext .divr51 {
  float: left;
  width: 34%;
  text-align: center;
}

.toplinetext .divr52 {
  float: left;
  width: 66%;
}

.toplinetext .divr51 i {
  font-size: 35px;
  color: #76ce10;
  margin-top: 3px
}

.toplinetext .divr52 p {
  margin: 0px;
  font-size: 13px;
}

.lineborder1 {
  border-radius: 50px 0px 0px 50px !important;
}

.toplineborder span {
  position: relative;
  /* right: 0px; */
  background: #fff;
  width: 24px;
  display: inline-block;
  border-radius: 50px;
  text-align: center;
  border: 5px solid #066578;
  color: #000;
  font-size: 10px;
  margin-right: -11px;
  z-index: 999;
}

.card-body {
  padding: 0px;
}

.cd-horizontal-timeline .timeline {
  padding: 0px;
}

.cd-horizontal-timeline {
  margin: 10px auto 0px auto;
}

.cd-horizontal-timeline .events-content {
  margin: 0px 0px 1em 0px
}

h6,
.h6 {
  font-size: 13px;
}







.card-bodyother {
  padding: 1.5rem;
  text-align: left;
}

.card-bodyother label {
  text-align: left;
}

div#example_filter {
  text-align: right;
}


#example_length {
  padding: 0px;
  margin: 0px;
  line-height: 36px;
}

#example_length label {
  display: inline-flex !important;
  line-height: 26px;
  height: calc(1.75rem + 2px);
  color: #1a1919;
}

#example_length label select {
  padding: 0px;
  border-radius: 0px;
  line-height: 26px;
  height: calc(1.75rem + 2px);
  margin: 0px 9px;
}

#example_filter label {
  display: inline-flex !important;
  margin-top: 0px;
  line-height: 26px;
  height: calc(1.75rem + 2px);
  color: #1a1919;
}

#example_filter label input {
  padding: 0px 15px;
  border-radius: 0px;
  margin: 0px 9px;
  height: calc(1.75rem + 2px);
}

div#example_paginate {
  text-align: right;
  float: right;
}

#example th {
  font-size: 12px;
  color: black !important;
}

#example td {
  font-size: 12px;
  color: rgb(20, 20, 20);
}

#example td,
#example th {
  padding: 2px 5px;
  text-align: center;
}



.product-shop .card.pull-up .card-contenta .card-body {
  padding: 1.0rem;
}

.product-shop .product-title {
  text-align: center;
  font-weight: bold;
  font-size: 18px;
  margin-top: 12px;
}

.product-shop .product-img img {
  margin: auto;
  max-height: 300px;
}

@media(max-width: 768px) {
  .product-shop .product-img img {
    margin: auto;
    max-height: 165px;
  }

  .product-shop .product-img {
    height: 170px !important;
    overflow: hidden;
  }
}

.product-shop .product-img {
  height: 300px;
  overflow: hidden;
}


.poducts h4 {
  font-weight: 600;
  font-size: 15px;
}

.form-control1 {
  width: 100%;
  font-size: 13px;
  border-radius: 50px;
  padding: 1px 9px;
}

.poducts h5 {
  font-weight: 500;
  font-size: 14px;
}

.poducts h5 .coloronile span {
  font-weight: 600;
  text-decoration: line-through;
  font-size: 14px;
  color: red;
}


.xzoom-thumbs {}

.xzoom-thumbs a img {
  width: 17%;
  border: 4px solid #f0f2f7;
  margin: 4px;
}

.xzoom-caption {
  display: none !important;
}



.profile-overview {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  background-clip: padding-box;
}

.profile-overview h3 {
  margin-top: 10px;
  font-size: 16px;
  font-weight: 500;
}

.profile-overview .socials li a {
  border-radius: 50%;
  -webkit-border-radius: 50%;
}

.show-tab i {
  opacity: 0;
}

.show-tab:hover i {
  opacity: 1;
}

.profile-detail tr:hover i {
  opacity: 1;
}

.profile-edit {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-border-radius: 5px;
  background-clip: padding-box;
  background-color: #323b44;
}

.profile-overview a {
  color: #fff !important;
}

.profile-overview td a {
  color: #06F !important;
}


.profileimages {
  width: 100%;
  float: left;
}

.profileimages img {
  width: 100px;
  height: 100px;
}

.profilepic {
  width: 100%;
  float: left;
}

.profilepic img {
  width: 200px;
  height: auto;
}

.letnamewel {
  width: 100%;
  float: left;
  padding-top: 15px;
}

.letnamewel h3 {
  font-weight: 600;
}

.letnamewel h4 {}

.kycForm table img {
  width: 75px;
}

.text-center.table.table-bordered.table-striped td,
.text-center.table.table-bordered.table-striped th {
  vertical-align: middle;
}

.lastbuttonclass {
  color: #fff !important;

}


.table-font-dha {}

.table-font-dha tr th {
  background: #e8e8e8;
  color: #000 !important;
}

.table-font-dha tr {
  border: 1px solid #ccc;
  padding: 0px;
}

.table-font-dha tr td,
.table-font-dha tr th {
  padding: 5px 2px !important;
  text-align: center;
  vertical-align: middle;
}

.table-font-dha tr td label,
.table-font-dha tr th label {
  margin: 0px;
  padding: 0px;
}


.profile-overview .avtar.text-center img {
  width: 200px;
}

.input-group-prepend-dha {
  position: relative;
}

.prepend-dha {
  position: absolute;
  height: 40px;
  width: 40px;
  padding: 0 6px;
  text-align: center;
  border: 1px solid #CACFE7;
  border-right: 0px;
  border-radius: 0.25rem 0rem 0rem 0.25rem;
}


.input-group-prepend-dha .form-control {
  padding-left: 40px;
}

.errordivdha {
  width: 100%;
  float: left;
}

.errordivdha #errorDiv {
  width: 100%;
  float: left;
}

@media(max-width: 768px) {
  .product-action.d-flex.justify-content-around {
    background: #f4f5fa;
    padding: 15px;
    border-radius: 5px;
    margin: 0 10px;
  }
}

div.tagsinput {
  border: 1px solid #CCC;
  background: #FFF;
  padding: 5px;
  width: 300px;
  height: 100px;
  overflow-y: auto;
}

div.tagsinput span.tag {
  border: 1px solid #a5d24a;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  display: block;
  float: left;
  padding: 5px;
  text-decoration: none;
  background: #cde69c;
  color: #638421;
  margin-right: 5px;
  margin-bottom: 5px;
  font-family: helvetica;
  font-size: 13px;
}

div.tagsinput span.tag a {
  font-weight: bold;
  color: #82ad2b;
  text-decoration: none;
  font-size: 11px;
}

div.tagsinput input {
  width: 80px;
  margin: 0px;
  font-family: helvetica;
  font-size: 13px;
  border: 1px solid transparent;
  padding: 5px;
  background: transparent;
  color: #000;
  outline: 0px;
  margin-right: 5px;
  margin-bottom: 5px;
}

div.tagsinput div {
  display: block;
  float: left;
}

.tags_clear {
  clear: both;
  width: 100%;
  height: 0px;
}

.not_valid {
  background: #FBD8DB !important;
  color: #90111A !important;
}

.product-action.d-flex.justify-content-around {
  background: #f4f5fa;
  padding: 15px;
  border-radius: 5px;
}

table.profiledha i {
  font-size: 15px;
}

#Div_memberDetails {
  font-size: 13px;
}

.button6col .col-sm-2 {
  padding: 0px 5px;
}

.button6col .col-sm-2 table {
  padding: 5px 10px;
  background: #fbfbfb;
}

.carddhaheader {
  border-bottom: 1px solid #efefef;
}

span a {
  position: relative;
}

span a span {
  display: none;
  position: absolute;
  z-index: 999;
  bottom: 44px;
  right: 0px;
  ;
}

span a:hover span {
  display: block;
}

span a span table {
  background: #fff;
  width: 270px;
}

.tabletreeandtree table,
.tabletreeandtree table td,
.tabletreeandtree table th {
  vertical-align: top;
}

.product-count img {
  width: 100%;
}

span.input-group-text.btn.btn-primary.p-0.last58 {
  border-radius: 0 0.25rem 0.25rem 0;
}

.product-detail .product-buttons .btn {
  padding: 11px 0.75rem;
}


#example55 th,
#example55 td {
  padding: 2px 5px;
}

.welldha {}

.welldha th {
  padding: 10px 5px;
  width: 30%;
}

.welldha td {
  padding: 10px 5px;
}

.welldha td,
.welldha th {
  border: 1px solid #dadada;
}

#errorDiv {}

.alert.alert-error {
  width: 100%;
  border-color: #FF394F !important;
  background-color: #FF4961 !important;
  color: #FFFFFF;
  display: inline-block;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid transparent;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  line-height: 1.25;
  border-radius: 0.25rem;
  -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
  -o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  -moz-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.text-error {
  color: red;
}



.unstyled.amounts li {
  list-style: none;
}

.unstyled.amounts strong {}


.xzoom-preview {
  z-index: 999;
}

.share-d-div {
  width: 400px;
  margin: 0px auto;
  position: fixed;
  z-index: 999;
  top: 20%;
  left: 40%;
}

.share-d-div .card-body {
  padding: 15px;
}

.copy-d-icon {
  width: 100%;
  float: left;
  padding: 15px;
  margin: 0px;
  text-align: left;
}

.copy-d-icon li {
  display: inline-table;
}

.copy-d-icon li a {
  text-decoration: none;
  text-align: center;
  width: 40px;
  height: 40px;
  float: left;
  border-radius: 50px;
  line-height: 40px;
  color: #fff;
  font-size: 20px;
}

.copy-d-icon li a:hover {
  text-decoration: none;
  text-align: center;
  width: 40px;
  height: 40px;
  float: left;
  border-radius: 50px;
  line-height: 40px;
  color: #fff;
  font-size: 22px;
}

.copy-d-icon li a i {}

.bg-d-alps {
  background: #fff;
}

.full-screencolor {
  position: fixed;
  background: rgba(0, 0, 0, 0.24);
  height: 100vh;
  width: 100%;
  float: left;
  z-index: 99999999999;
  top: 0px;
  background-size: 100%;
}



















@media (max-width: 767.98px) {

  .navbar-dark .navbar-header .navbar-nav .nav-link,
  .navbar-semi-dark .navbar-header .navbar-nav .nav-link {
    color: #000000;
  }

  .header-navbar .navbar-header .navbar-brand {
    padding: 9px 0;
    margin-right: 0;
  }
}


/*news-----section*/

.panel {
  margin-bottom: 20px;
  background-color: #fff;
  -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, .0);


  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #FFFFFF;
  -webkit-background-clip: border-box;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 0.35rem;
}

.panel {
  /* margin-bottom: 20px; */
  background-color: #fff;
  border: none;
  /* border: 1px solid transparent; */
  /* border-radius: 4px; */
  /* -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05); */
  /* box-shadow: 0 1px 1px rgba(0,0,0,.05); */
}

.panel-default>.panel-heading {
  /* background-image: -webkit-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%); */
  background-image: linear-gradient(to bottom, #ffff 0, #ffff 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);
}

.panel-default>.panel-heading span b {

  padding: 5px;
  background: #fff;
  font-weight: 500;
  letter-spacing: 0.05rem;
  font-size: 2.12rem;
}

.panel .card-header {
  padding: 4px 15px;
  border-bottom: 1px solid transparent;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
}

.panel-footer {
  padding: 10px 15px;
  background-color: #fff;

}

.panel-default {
  border-color: #fff;
  background: #fff !important;
}

.panel-default>.panel-heading {
  color: #333;
  background-color: #fff;
  border-color: #fff;
}

.panel-footer {
  padding: 0px 15px;
  background-color: #fff;
  border-top: 1px solid #fff;
}

.panel-footer ul li a {
  color: #000;
  background-color: #fff;

}

.panel-footer ul li a:hover {
  color: #000;
  background-color: #fff;

}


.btn-info:hover {
  background: #729613 !important;
}

button#btn_submit {
  background-color: #005d1d !important;
  border-color: green !important;
}


.modal-header {
  background: #ff0000;

  padding: 7px 15px;
  border: none;
}

.modal-header h4 {
  font-weight: bold;
  color: #fff;
  padding-top: 5px;
}

button.close {
  color: #fff;
  opacity: 9;
  font-size: 31px;
}

.content-popup {
  display: block;
  padding-left: 21px;
  font-size: 19px;
  height: 244px;
  overflow-y: scroll;
}

.modal-content {
  height: 404px;
}

.modal-dialog {
  position: relative;
  width: 600px !important;
  max-width: 600px !important;
  top: 75px !important;
}

span#ctl00_ContentPlaceHolder1_lbldescpop {
  font-weight: 400 !important;
}

i {
  padding-right: 3px;
}




i.toggle-icon.font-medium-3.ft-toggle-right {
  color: #777 !important;
}



@media screen and (max-width: 480px) {
  .header-navbar .navbar-header .navbar-brand .brand-logo {
    height: auto !important;
    width: 70px !important;
    margin-top: -18px !important;
    margin-left: 0px !important;
  }

  div#printT {
    width: 100%;
    overflow: auto;
  }

  select#ctl00_ContentPlaceHolder1_txtmobilecode {
    width: 24.5rem !important;
  }


}


.expanded .brand-logo {
  height: auto !important;
  width: 130px !important;
  margin-top: 0px !important;
  margin-left: 15px !important;
}




body.vertical-layout.vertical-menu-modern.menu-collapsed .navbar .navbar-brand {
  padding: 1px 0;
}


input#ctl00_ContentPlaceHolder1_RadioButtonList1_0 {
  padding-right: 6px;
  position: relative;
  right: 2px;
  top: 1px;
}



.bg-c-blue {
  background: -webkit-gradient(linear, left top, right top, from(#01a9ac), to(#01dbdf));
  background: linear-gradient(to right, #01a9ac, #01dbdf)
}

.bg-simple-c-blue {
  background: #01a9ac
}

.text-c-blue {
  color: #01a9ac
}

.bg-c-pink {
  background: -webkit-gradient(linear, left top, right top, from(#fe5d70), to(#fe909d));
  background: linear-gradient(to right, #fe5d70, #fe909d)
}

.bg-simple-c-pink {
  background: #fe5d70
}

.text-c-pink {
  color: #fe5d70
}

.bg-c-green {
  background: -webkit-gradient(linear, left top, right top, from(#0ac282), to(#0df3a3));
  background: linear-gradient(to right, #0ac282, #0df3a3)
}

.bg-simple-c-green {
  background: #0ac282
}

.text-c-green {
  color: #0ac282
}

.bg-c-yellow {
  background: -webkit-gradient(linear, left top, right top, from(#fe9365), to(#feb798));
  background: linear-gradient(to right, #fe9365, #feb798)
}

.bg-simple-c-yellow {
  background: #fe9365
}

.text-c-yellow {
  color: #fe9365
}

.bg-c-orenge {
  background: -webkit-gradient(linear, left top, right top, from(#FE8A7D), to(#feb8b0));
  background: linear-gradient(to right, #FE8A7D, #feb8b0)
}

.bg-simple-c-orenge {
  background: #fe8a7d
}

.text-c-orenge {
  color: #fe8a7d
}

.bg-c-lite-green {
  background: -webkit-gradient(linear, left top, right top, from(#01a9ac), to(#01dbdf));
  background: linear-gradient(to right, #01a9ac, #01dbdf)
}

.bg-simple-c-lite-green {
  background: #01a9ac
}

.text-c-lite-green {
  color: #01a9ac
}

.bg-c-amber {
  background: -webkit-gradient(linear, left top, right top, from(#35c033), to(#2c429b));
  background: linear-gradient(to right, #35c033, #2c429b)
}

.bg-simple-c-amber {
  background: #35c033
}

.text-c-amber {
  color: #35c033
}



/* ================================================================
   ██████  MODERN DASHBOARD REDESIGN  ██████
   Clean professional light theme with dark sidebar (CNM Style)
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ===== Global Base ===== */
body.vertical-layout {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  background: #f4f6f9 !important;
  color: #1e293b !important;
}

/* ===== Scrollbar ===== */
::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: #f4f6f9;
}

::-webkit-scrollbar-thumb {
  background: #c4c9d4;
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* ===== Top Header/Navbar ===== */
.header-navbar.navbar-semi-dark .navbar-header,
.header-navbar .navbar-header {
  background: #ffffff !important;
  border-bottom: 1px solid #e9ecef !important;
  height: 64px !important;
}

.header-navbar .navbar-wrapper {
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

.navbar-container.content {
  background: #ffffff !important;
}

.navbar-semi-dark .navbar-header {
  background: #ffffff !important;
}

.header-navbar .navbar-header .navbar-brand .brand-logo {
  top: -15px !important;
  max-height: 74px !important;
  width: auto !important;
}

.header-navbar .navbar-container .navbar-collapse .navbar-nav .nav-link {
  color: #64748b !important;
}

.header-navbar .navbar-container .navbar-collapse .navbar-nav .nav-link:hover {
  color: #1e293b !important;
}

.dropdown-toggle.nav-link.dropdown-user-link {
  color: #475569 !important;
}

.user-name.text-bold-700 {
  color: #334155 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.avatar img {
  border: 2px solid #e2e8f0 !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ===== Sidebar ===== */
.main-menu.menu-dark.menu-accordion.menu-shadow {
  background: #20283c !important;
  /* Dark blue/grey sidebar from screenshot */
  border-right: none !important;
  box-shadow: 2px 0 15px rgba(0, 0, 0, 0.08) !important;
  color: #fff !important;
}

.main-menu.menu-dark .navigation {
  background: transparent !important;
}

.main-menu.menu-dark .navigation>li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
  padding: 0 !important;
}

.main-menu.menu-dark .navigation li a {
  color: #94a3b8 !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  letter-spacing: 0.2px;
  transition: all 0.2s ease !important;
  padding: 14px 20px !important;
}

.main-menu.menu-dark .navigation li a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

.main-menu.menu-dark .navigation li a i {
  color: #64748b !important;
  font-size: 18px !important;
  margin-right: 12px !important;
  transition: all 0.3s ease;
}

.main-menu.menu-dark .navigation li a:hover i {
  color: #94a3b8 !important;
}

.main-menu.menu-dark .navigation>li.active>a {
  background: #2563eb !important;
  /* Bright blue from screenshot */
  color: #ffffff !important;
  font-weight: 600 !important;
  border-right: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

.main-menu.menu-dark .navigation>li.active>a i {
  color: #ffffff !important;
}

.main-menu.menu-dark .navigation>li.open>a {
  background: rgba(255, 255, 255, 0.06) !important;
  border-right: none !important;
  color: #ffffff !important;
}

.main-menu.menu-dark .navigation>li>ul {
  background: #182033 !important;
  border-left: none;
  margin-left: 0;
  padding: 6px 0;
}

.main-menu.menu-dark .navigation>li>ul li a {
  color: #64748b !important;
  font-size: 13px !important;
  padding: 10px 20px 10px 50px !important;
}

.main-menu.menu-dark .navigation>li>ul li a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

/* Sidebar Welcome Text */
.main-menu>div:first-child {
  color: #94a3b8 !important;
  font-size: 12px !important;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: capitalize;
  padding: 20px 20px 15px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}

.main-menu.menu-dark .navigation>li>ul.menu-content {
  background: #182033 !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content>li {
  background: transparent !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content>li>a {
  color: #94a3b8 !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content>li>a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content {
  background: #182033 !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content>li {
  background: transparent !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content>li>a {
  color: #94a3b8 !important;
}

.main-menu.menu-dark .navigation>li>ul.menu-content>li>a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

/* ===== Main Content Area ===== */
.app-content.content {
  background: #f4f6f9 !important;
}

.content-wrapper {
  background: transparent !important;
}

/* ===== Cards Global ===== */
.card {
  background: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
  transition: all 0.3s ease !important;
  overflow: hidden;
}

/* ===== Referral Card ===== */
.ref-card {
  background: #ffffff !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
}

.ref-card .text-dark,
.ref-card strong {
  color: #334155 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.ref-card .form-control {
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  color: #475569 !important;
  border-radius: 6px !important;
  font-size: 13px !important;
  padding: 10px 15px !important;
  height: 40px !important;
}

.new_bg {
  background: #1e1e2d !important;
  border: none !important;
  border-radius: 6px !important;
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  padding: 8px 18px !important;
  transition: all 0.2s ease !important;
}

.new_bg:hover {
  background: #151521 !important;
  transform: translateY(-1px) !important;
}

/* ===== Profile Card (carddha) ===== */
.carddha {
  background: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
}

.carddha::before {
  background: #ffffff !important;
  opacity: 1 !important;
}

.carddha:after {
  display: none !important;
}

.carddha .card-content .img-fluid {
  border: 3px solid #f1f5f9 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
}

.carddha .card-content .img-fluid-red {
  border: 3px solid #fee2e2 !important;
  box-shadow: 0 4px 15px rgba(239, 68, 68, 0.1) !important;
}

table.profiledha {
  color: #334155 !important;
}

table.profiledha tr {
  border-bottom: 1px solid #f1f5f9 !important;
}

table.profiledha th {
  color: #64748b !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}

table.profiledha th i {
  color: #94a3b8 !important;
}

table.profiledha td {
  color: #1e293b !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

/* ===== Stat Cards (pull-up) ===== */
.card.pull-up {
  border-radius: 8px !important;
  border: none !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
  overflow: hidden;
}

.card.pull-up:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.06) !important;
}

.card.pull-up .card-content {
  border: none !important;
  border-radius: 8px !important;
}

.card.pull-up .card-content .card-body {
  padding: 24px !important;
  height: auto !important;
  min-height: 100px;
}

.card.pull-up .media-body h3 {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin-bottom: 6px;
}

.card.pull-up .media-body h4,
.card.pull-up .media-body h6 {
  color: #64748b !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.card.pull-up .media-body a {
  color: #1e293b !important;
  text-decoration: none !important;
}

.card.pull-up i.la,
.card.pull-up i.fa,
.card.pull-up i.fas {
  color: #cbd5e1 !important;
  font-size: 28px !important;
  transition: all 0.3s ease;
}

/* Override card color classes — CNM Exact Style */
/* Green Card ("Active") */
.card.pull-up.color11 {
  background: #117b4c !important;
  /* Deep green */
  color: #ffffff !important;
}

.card.pull-up.color11 * {
  color: #ffffff !important;
}

.card.pull-up.color11 .media-body h3,
.card.pull-up.color11 .media-body h4,
.card.pull-up.color11 .media-body a,
.card.pull-up.color11 .media-body h6,
.card.pull-up.color11 label,
.card.pull-up.color11 span {
  color: #ffffff !important;
}

.card.pull-up.color11 i.la,
.card.pull-up.color11 i.fa {
  color: rgba(255, 255, 255, 0.2) !important;
  font-size: 42px !important;
}

/* Dark Blue Card ("Rank") */
.card.pull-up.color12 {
  background: #1e304f !important;
  /* Dark navy */
  color: #ffffff !important;
}

.card.pull-up.color12 * {
  color: #ffffff !important;
}

.card.pull-up.color12 .media-body h3,
.card.pull-up.color12 .media-body h4,
.card.pull-up.color12 .media-body a,
.card.pull-up.color12 .media-body h6,
.card.pull-up.color12 label,
.card.pull-up.color12 span {
  color: #ffffff !important;
}

.card.pull-up.color12 i.la,
.card.pull-up.color12 i.fa {
  color: rgba(255, 255, 255, 0.1) !important;
  font-size: 42px !important;
}

/* White Cards with slight accents */
.color13 {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
}

.color13 * {
  color: #1e293b !important;
}

.color13 h4,
.color13 h6 {
  color: #64748b !important;
}

.color13 i.la,
.color13 i.fa {
  color: #3b82f6 !important;
}

.color14 {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
}

.color14 * {
  color: #1e293b !important;
}

.color14 h4,
.color14 h6 {
  color: #64748b !important;
}

.color14 i.la,
.color14 i.fa {
  color: #f59e0b !important;
}

/* Default Pull-Up Card (E-pin, Processed Orders) */
.card.pull-up:not(.color11):not(.color12) {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
}

.card.pull-up:not(.color11):not(.color12) label,
.card.pull-up:not(.color11):not(.color12) span,
.card.pull-up:not(.color11):not(.color12) h3 {
  color: #1e293b !important;
  font-weight: 700 !important;
}

.card.pull-up:not(.color11):not(.color12) h4,
.card.pull-up:not(.color11):not(.color12) h6 {
  color: #64748b !important;
  font-weight: 600 !important;
}

/* ===== Wallet/Reward Cards (carda) ===== */
.carda {
  background: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04) !important;
}

.carda .card-header {
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 12px 20px !important;
}

.carda .card-header h4.card-title {
  color: #334155 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  text-transform: uppercase;
}

.carda .card-header h4.card-title i {
  display: none !important;
  /* Hide icons in header to match clean style */
}

/* ===== Footer ===== */
footer.footer {
  background: #ffffff !important;
  border-top: 1px solid #f1f5f9 !important;
}

footer.footer p {
  color: #94a3b8 !important;
  font-size: 12px !important;
}

/* ===== News/iFrame Section ===== */
.card iframe {
  border-radius: 8px !important;
  border: 1px solid #f1f5f9 !important;
}

/* ===== Buttons Global ===== */
.btn {
  border-radius: 6px !important;
  font-family: 'Inter', sans-serif !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  transition: all 0.2s ease !important;
}

.btn-info {
  background: #2563eb !important;
  border: none !important;
  color: #fff !important;
}

.btn-info:hover {
  background: #1d4ed8 !important;
}

.btn-warning {
  background: #f59e0b !important;
  border: none !important;
  color: #fff !important;
}

.btn-danger {
  background: #ef4444 !important;
  border: none !important;
}

/* ===== Dropdown Menu ===== */
.dropdown-menu {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
  padding: 4px !important;
}

.dropdown-item {
  color: #475569 !important;
  font-size: 13px !important;
  padding: 8px 16px !important;
  border-radius: 4px !important;
}

.dropdown-item:hover {
  background: #f1f5f9 !important;
  color: #1e293b !important;
}

/* ===== Modal ===== */
.modal-content {
  background: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
}

.modal-header {
  background: #1e293b !important;
  border-bottom: none !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 15px 20px !important;
}

.modal-header h4 {
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}

.modal-body {
  padding: 20px !important;
}

.modal-body label {
  color: #475569 !important;
  font-weight: 500 !important;
  font-size: 13px !important;
}

/* ===== Tables ===== */
.table {
  color: #334155 !important;
}

.table-bordered {
  border-color: #f1f5f9 !important;
}

.table thead tr {
  background: #f8fafc !important;
}

.table thead th {
  border-color: #f1f5f9 !important;
  color: #64748b !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: uppercase;
}

.table tbody td {
  border-color: #f1f5f9 !important;
  color: #475569 !important;
  font-size: 13px !important;
}

.table-hover tbody tr:hover {
  background: #f8fafc !important;
}

/* ===== Form Controls ===== */
.form-control {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #1e293b !important;
  border-radius: 6px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 13px !important;
}

.form-control:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15) !important;
}

/* ===== Badge ===== */
.badge {
  font-family: 'Inter', sans-serif !important;
  font-weight: 600 !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
}

/* ===== Panel/News overrides ===== */
.panel,
.panel-default {
  background: #ffffff !important;
  border: 1px solid #f1f5f9 !important;
  border-radius: 8px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

.panel-default>.panel-heading {
  background: #f8fafc !important;
  border-bottom: 1px solid #f1f5f9 !important;
  color: #334155 !important;
}

.panel-default>.panel-heading span b {
  background: transparent !important;
  color: #1e293b !important;
}

.panel-footer {
  background: #ffffff !important;
  border-top: 1px solid #f1f5f9 !important;
}

.panel-footer ul li a {
  color: #64748b !important;
}

.panel-footer ul li a:hover {
  color: #2563eb !important;
  background: #f8fafc !important;
}

/* ===== Error/Alert Overrides ===== */
.alert.alert-error {
  background: #fef2f2 !important;
  border-color: #fecaca !important;
  color: #ef4444 !important;
}

/* ===== Share Popup ===== */
.bg-d-alps {
  background: #ffffff !important;
  border-radius: 8px !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
}

.bg-d-alps .card-header {
  background: #1e293b !important;
}

.bg-d-alps .card-header h4 {
  color: #fff !important;
}

.full-screencolor {
  background: rgba(15, 23, 42, 0.6) !important;
  backdrop-filter: blur(2px) !important;
}

/* ===== DataTable Overrides ===== */
.dataTables_info {
  color: #64748b !important;
}

#example_length label select,
#example_filter label input {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
  border-radius: 4px !important;
}

#example th {
  color: #64748b !important;
}

#example td {
  color: #475569 !important;
}

div#example_paginate .paginate_button {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 4px !important;
  margin: 0 2px;
}

div#example_paginate .paginate_button:hover {
  background: #f1f5f9 !important;
}

div#example_paginate .paginate_button.current {
  background: #2563eb !important;
  color: #fff !important;
  border-color: #2563eb !important;
}

.blink_me {
  color: #f59e0b !important;
}

i.toggle-icon.font-medium-3.ft-toggle-right {
  color: #94a3b8 !important;
}

/* Force hyperlinks inside colored cards to be white */
.card.pull-up.color11 a,
.card.pull-up.color12 a,
.card.pull-up.color11 h3 a,
.card.pull-up.color12 h3 a,
.card.pull-up.color11 h4 a,
.card.pull-up.color12 h4 a,
.card.pull-up.color11 span a,
.card.pull-up.color12 span a {
  color: #ffffff !important;
}

/* Scenic Banner Background */
.eco-banner-bg {
  background: linear-gradient(to right, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.7) 45%, transparent 100%), url('../img/eco_banner.jpg?v=2') !important;
  background-size: cover !important;
  background-position: center !important;
}