body {color: #fff; background: #00030a; font-weight: 500; font-size: 15px; font-family: 'Montserrat', sans-serif;}

a, a:active, a:focus, a:hover {outline: none;  text-decoration: none;}
button, button:active, button:focus, button:hover {outline: none;  text-decoration: none;}

.fs-7 {font-size: .9rem !important;}
.fs-8 {font-size: .8rem !important;}

.modal{
  --bs-modal-bg: #222;
  --bs-modal-inner-border-radius:20px;
  --bs-modal-border-color: #dee2e614;
  --bs-modal-header-border-color: #dee2e614;
  --bs-modal-footer-border-color: #dee2e614;
}
.notification-card{height: 500px; overflow-x: auto;}
.pointer{cursor: pointer;}
label {color: #94ceeb;}
.btn_style{background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%);
  background-size: 200% 100%; color: #000; border: none; cursor: pointer;
  transition: all .5s; font-weight: 600; display: inline-block;  padding: 12px 30px; text-align: center; border-radius: 40px;}
.btn_style:hover {background-position: 100% 0; color: #000;}

.login_body{background:#202020 url(../img/Background-1.jpg) no-repeat center;background-size: cover; background-attachment: fixed; min-height: 100vh; overflow-x: auto;}
.login_box_width{margin: auto; max-width: 550px;}
.login_box {display: block; background: #ffffff0a; border-radius: 20px; padding: 25px;}
.login_logo img{max-width: 220px;}
.login_box p{color: #fff;}

.login_text{color: #9ad8f3;}
.theme_color{color: #9ad8f3;}
.form-control, .form-select{background-color: #ffffff1a; font-size: 15px; color: #fff; padding: 11px 15px; border: 1px solid #ffffff0a; border-radius: 10px;}
.form-select{background-image: url(../img/down-arrow.png) !important; background-repeat: no-repeat !important;  background-position: right .75rem center !important;  background-size: 10px 6px !important;}
.form-control:focus, .form-select:focus {color: #fff; background-color: #ffffff1a; box-shadow: none; border: 1px solid #9ad8f3;}
.form-control::placeholder{color: #fff; opacity: .5;}
.eye_show_box{position: absolute; right: 15px; cursor: pointer; top: 14px;}

select option{color: #000;}

.btn-close{filter: brightness(0) invert(1);}

.inner_header{background: #202020; padding: 10px 15px; height: 70px; position: fixed; top:0; left: 0; right: 0; z-index: 11;}
.MuiPaper-root.MuiPaper-elevation{background: #202020 !important; top: 70px !important; height: calc(100vh - 70px);}

.left_menu_list{list-style: none; margin: 0; padding: 0; font-size: 13px;}
.left_menu_list li a{display: block; padding: 5px 0px; position: relative; text-align: center; color: #bbbbbd;}
.left_menu_list li{margin-bottom: 15px;}
.left_menu_list li:last-child{margin-bottom: 0;}
.left_menu_list li a .icon_box{display: block; font-size: 19px;}
.app-container{padding-top: 90px; padding-left: 80px; padding-bottom: 20px; background: url(../img/Background-1.jpg) no-repeat center; background-size: 100% 100%;
  background-attachment: fixed; min-height: 100vh;}
.mobile_menu {position: fixed; z-index: 11; left: 15px; top: 20px;}
.right_menu_arrow{display: none;}
.left_menu_list > li > a.active{background: #2d2d2d;  color: #fff;}
.left_menu_list > li > a:hover{background: #2d2d2d;  color: #fff;}
.left_menu_list > li > a.active::before{content: ""; width: 2px; background: #9ad8f3; position: absolute; left: 0; top:0; bottom: 0;}

.logo{width: 180px;}
.logo_icon{width: 40px;}

.login_box_width .mt-5.gap-3.flex-wrap{display: none !important;}

.arrow_none.dropdown .dropdown-toggle::after {display: none;}
.arrow_none .btn-primary{background-color: transparent; padding: 0px; border-radius: 0; border: none;}
.arrow_none .btn-primary:hover, .arrow_none .btn-primary:focus, .arrow_none .btn-primary:active, .arrow_none .btn-primary:disabled, .arrow_none .btn-primary:disabled{background-color: transparent !important; border: none !important;}

.user_dropdown:hover button img{opacity: 1;}
.user_dropdown .dropdown-menu {width: 300px; border-radius: 20px; color: #fff; padding: 0;  background: #363636;}

.dropdown-link{display: block; color: #fff; padding: 11px 15px; margin-bottom: 3px; width: 100%; background: transparent; border: none; text-align: left; font-weight: 500;  font-size: 14px; }
.dropdown-link:hover{background:#383a3c; color: #fff;}
.dropdown-link.active{background: #383a3c; color: #fff;}
.user_dropdown .left_menu_list li > a:hover{background: #292929;}
.dropdown-inner-box{background: #4a4a4a;}

.user_active_circle{background: #4ade80; display: inline-block; height: 10px; width: 10px; border-radius: 50%;}
.user-dropdown-link{color: #9f9f9f; display: block; margin-bottom: 5px;}
.user-dropdown-link:last-child{margin-bottom: 0}
.user-dropdown-link:hover{color: #9ad8f3;}
.dropdown_user_name{background: #2d2d2d; font-size: 18px; color: #8D8D8D; position: relative; height: 40px; width: 40px; font-weight: 500; border-radius: 7px; display: flex; align-items: center; justify-content: center;}
.dropdown_user_name img{width: 100%; border-radius: inherit;}
.bell_point{background: #9ad8f3; position: absolute;  right: 10px;  top: 10px;  border: 3px solid #2d2d2d; display: inline-block; height: 10px; width: 10px; border-radius: 50%;}

.loader-container {width: 100vw; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 111111; height: 100vh; display: flex; justify-content: center; align-items: center; background-color:#0009;}
.loader {
  width: 30px;
  height:30px;
  border-radius: 50%;
  background: radial-gradient(farthest-side,#9ad8f3 94%,#0000) top/4px 4px no-repeat,  conic-gradient(#0000 30%,#9ad8f3);
  -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 4px),#000 0);
  animation: spinner-ub 0.8s infinite linear;
}
 
@keyframes spinner-ub {
  100% {
     transform: rotate(1turn);
  }
}
.page-padding{padding-left: 15px; padding-right: 15px;}
.welcome_box{background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%);
  background-size: 200% 100%; color: #000;}

.btn_border{outline: 1px solid #289bc3; display: inline-block; color: #fff; padding: 10px 20px; font-weight: 600; border-radius: 30px;}
.btn_border:hover{background-image: linear-gradient(to right, #16b192 0%, #289bc3 51%, #3984f1 100%);}

.btn_style2{border: 1px solid #9ad8f3 !important;
  background: transparent;
  color: #9ad8f3; 
  font-weight: 600;
  display: inline-block;
  font-size: 13px;
  padding: 10px 30px;
  text-align: center;
  border-radius: 40px;}
.btn_style2:hover{color: #000; background: #9ad8f3;}
.btn_style2:hover .text-white{color: #000 !important;}
.btn_text{color: #9ad8f3;}

.welcome_icon_box{background: #0000004f; width: 50px;  height: 50px;  border-radius: 10px;  font-size: 25px;  display: flex;  align-items: center;  justify-content: center;}

.user_card{background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%);
  background-size: 200% 100%;
  color: #000;}

.Package_box{padding: 20px 20px; border-radius: 15px; border: 1px solid #9ad8f361;
  background-size: 200% 100%;}



.wallet_box{padding: 20px 20px; transition: all 0.5s ease; color: #000; border-radius: 15px; background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%);
  background-size: 200% 100%;}
.wallet_box:hover{background-position: 100% 0; color: #000;}

.wallet_box_icon{background: #0000004f; padding: 9px; width: 40px;  height: 40px;  border-radius: 10px;  font-size: 25px;  display: flex;  align-items: center;  justify-content: center;}
.wallet_box_icon img{width: 100%; filter: brightness(0) invert(0);}

.card_icon_box{background: #0000004f; padding: 9px; width: 40px;  height: 40px;  border-radius: 10px;  font-size: 25px;  display: flex;  align-items: center;  justify-content: center;}
.card_icon_box img{width: 100%; filter: brightness(0) invert(0);}

.progress-bar.bg-secondary{background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%);
  background-size: 200% 100%;}

.slider_box{border:1px solid hsla(220,9%,46%,.3); border-radius: 1rem; padding: 1.5rem;}


.slider_box{position: relative; margin: 0px 20px; overflow: hidden; z-index: 1;}
.slider_box_bg{filter:blur(25px); opacity: .3; width: 100%; height: 100%; object-fit: cover; position: absolute; left: 0; top: 0; z-index: -1;}
.slider_box_img{width: 250px;}

.slider_box_shield{background: #ffffff14; display: inline-block;  margin-bottom: 10px;  padding: 6px 12px;  border-radius: 5px;  font-size: 13px;}
.slick-dots li.slick-active button::before {opacity: 1 !important;color: #9ad8f3 !important;}
.slick-dots li button::before{color: #fff !important;}
.slick-dots li {margin: 0 !important;}
.slick-dots {position: unset !important;}

.card{background-color:#222; border-radius: 15px; color: #fff;}
.card-bg{background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%); background-size: 200% 100%; color: #000;}
.card-gradient .card{background-image: linear-gradient(to right, #9ad8f3 0%, #405289 51%, #9ad8f3 100%); background-size: 200% 100%; color: #000;}

.Packageslider_box{position: relative; border: 1px solid hsla(220,9%,46%,.3); margin: 0px 7px; overflow: hidden;  border-radius: 10px;}
.Packageslider_box_img{width: 100%;}
.Packageslider_box h5{margin-bottom: 0; background: #0000004d; text-transform: uppercase;  padding: 5px;  border-radius: 5px; font-size: 16px; text-align: center; position: absolute; left: 10px; right: 10px; bottom: 10px;}
.required{color: rgba(var(--bs-danger-rgb),var(--bs-text-opacity)) !important;}

.btn:hover {
 border-color: #5b8fa8;
}
.btn-primary {
  --bs-btn-color: #000;
  --bs-btn-bg: #9ad8f3;
  --bs-btn-border-color: #9ad8f3;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #5b8fa8;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #5b8fa8;
  --bs-btn-active-border-color: #fff;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #9ad8f3;
  --bs-btn-disabled-border-color: #9ad8f3;
}
.btn-dark {
  --bs-btn-color: #fff;
  --bs-btn-bg: #242424;
  --bs-btn-border-color: #242424;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #242424;
  --bs-btn-focus-shadow-rgb: 66,70,73;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #242424;
  --bs-btn-active-border-color: #242424;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #242424;
  --bs-btn-disabled-border-color: #242424;
}
.btn-secondary {
  --bs-btn-color: #8d8d8d;
  --bs-btn-bg: #202020;
  --bs-btn-border-color: #202020;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: 130,138,145;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #fff;
  --bs-btn-active-border-color: #fff;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #202020;
  --bs-btn-disabled-border-color: #202020;
}
.table {
  --bs-table-color: #fff;
  --bs-table-bg: transparent;
  --bs-table-border-color: #202020;
}
.table thead tr th{  --bs-table-bg: #2d2d2d;}
.table tr td p{margin-bottom: 0;}

.page-link:focus{box-shadow: none; color: #000;}
.pagination {
   --bs-pagination-color:#8d8d8d;
  --bs-pagination-bg: #202020;
  --bs-pagination-border-width: var(--bs-border-width);
  --bs-pagination-border-color: #8d8d8d;
  --bs-pagination-border-radius: var(--bs-border-radius);
  --bs-pagination-hover-color: var(--bs-link-hover-color);
  --bs-pagination-hover-bg: var(--bs-tertiary-bg);
  --bs-pagination-hover-border-color: #8d8d8d;
  --bs-pagination-focus-color: var(--bs-link-hover-color);
  --bs-pagination-focus-bg: var(--bs-secondary-bg);
  --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: #535353;
  --bs-pagination-active-border-color: #535353;
  --bs-pagination-disabled-color: var(--bs-secondary-color);
  --bs-pagination-disabled-bg: var(--bs-secondary-bg);
  --bs-pagination-disabled-border-color: #8d8d8d;
  display: flex;
  padding-left: 0;
  list-style: none;
}
.card-header {border-bottom: 1px solid #202020;}
.card-footer {border-top: 1px solid #202020;}
table th strong{font-weight: 600;}
.page-header{font-size: 25px; font-weight: 600;}
.welcome_box .text-white{color:  #000 !important;}
.referal_link{background: #ffffff0d;  padding: 8px 15px;  font-size: 14px;  border-radius: 7px;  border: 1px solid #cccccc24; color: #ccc; }
.card_border{border: 1.5px solid #9ad8f361; background: #202020 !important;}
.table > :not(caption) > * > * {padding: .7rem .5rem;}
.card-title{margin-bottom: 0;}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
}
.paymentGatewayLogo{width: 150px; filter: brightness(0) invert(1);}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
  color: #000;
  background-color: #9ad8f3;
}
.rd3t-node {cursor: pointer !important;fill: #777 !important; stroke: unset !important;}
.rd3t-link {stroke: #9e9e9e !important;}
.rd3t-leaf-node {stroke: unset !important;}
.nav-pills .nav-link {background: #202020; color: #fff;}
.form-control:disabled {background-color: #222121;opacity: 1;}
.img-5x{width: 60px; height: 60px;}

.toggle-sidebar{background: #000; color: #fff; border: none; padding: 5px 10px; border-radius: 5px;}
.bot-message { display: flex;justify-content: start;flex-direction: column; gap: 2px;}
.bot-message img{width: 100px;}
.bot-message-text {width: fit-content; margin-bottom: 5px; border-radius: 0px 10px 10px 10px; padding: 0.5rem; background: #ffffff0f; font-size: 13px;}
.bot-message-text span{display: block; margin: 0 !important; margin-top: 5px !important; position: unset !important; padding: 0 !important;}

.user-message { display: flex;justify-content: end;gap: 2px;}
.user-message img{width: 100px;}
.user-message-text {width: fit-content; margin-bottom: 5px; border-radius: 10px 0px 10px 10px; padding: 0.5rem; background: #ffffff0f; font-size: 13px;}
.user-message-text span{display: block; margin: 0 !important; margin-top: 5px !important; position: unset !important; padding: 0 !important;}

.chat-msg-box-shadow{height: 322px; overflow-x: auto;}
.chatListM_bg {background: #fff; border: 1px solid rgba(29, 29, 29, 0.1); cursor: pointer; padding: 10px; border-radius: 10px; margin-bottom: 10px;}
.chatListM_bg.chatListM_bg_active{background: #e3e3e3;}
.chat-input {display: flex;gap: 6px;}
.chat-input-input {flex-grow: 1; flex-shrink: 1; border: 2px black; border-radius: 5px; padding: 5px;}
.chat-input-button {background: #333336;color: white;padding: 8px 20px; cursor: pointer; border: 0;}
.chat-input-button:hover {background: #333336;}
.chatBox {height: 70vh; display: flex;}
.chatRaise {justify-content: flex-end; display: flex;}
.chat_ticket_h{height: 350px; overflow-x: auto;}
.chatRaiseM {display: none; justify-content: flex-end; display: flex; margin: 5px;}
.chatHead {display: none;}
.chatListM {display: block;opacity: 1;}
@media only screen and (max-width: 990px) {
  .chatListM {background: #fff;}
  .card-task .emoji-task {display: block; gap: 5px; font-size: 15px; align-items: baseline;}
  .banner_graph {height: 100%;}
  .chatMsgM {width: 100% !important;}
  .chatRaise {display: none !important;}
  .chatRaiseM {display: block !important}
  .chatHead {display: flex !important; justify-content: space-between; align-items: center;}
}
.user-message-text img{width: 60px; border-radius: 10px;}
/* .user-message > div{background: #fff; box-shadow: 0px 0px 4px 1px #ccc; display: inline-block; padding: 10px 20px; border-radius: 10px;} */
.user-message-text {display: block; color: #fff;}
.user-message{margin-bottom: 10px; color: #fff;}
.chatMsgM{height: 500px; color: #fff;}

.ticket_box{background: #292828; margin-bottom: 5px; cursor: pointer; border-radius: 10px;  padding: 10px 10px;  font-size: 13px;}
.ticket_box_height{height: 400px; overflow-x: auto;}

.home_profile_img{width: 115px;}
.home_profile_icon{background: #0000004f;  width: 25px;  height: 25px;  border-radius: 50px;  display: flex;  align-items: center;  justify-content: center;}

.slick-slide .wallet_box {margin: 0px 5px;}
.slick-list {padding: 2px 0px !important;}


::-webkit-scrollbar {width: 3px;border: 1px solid #d5d5d5;}
::-webkit-scrollbar-track {border-radius: 0;background: #1b1b1b;}
::-webkit-scrollbar-thumb {border-radius: 0; background: #b0b0b0;}

.tradingview-widget-copyright{display: none !important;}
.tv-embed-widget-wrapper__body{border-color: transparent !important;}