@charset "utf-8";

*{margin:0px; padding:0px;}


input[type=password]::-ms-reveal,
input[type=password]::-ms-clear
{
    display: none;
}
:root{
    --primary: #005de1;
    --bs-primary: #005de1;
 
}
.pagination{
   --bs-link-hover-color: #004380;
    --bs-pagination-active-bg: #005de1;
    --bs-pagination-active-border-color: #004380;
    --bs-pagination-color: #000;
}
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #005de1;
  --bs-btn-border-color: #005de1;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #004380;
  --bs-btn-hover-border-color: #004380;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #004380;
  --bs-btn-active-border-color: #004380;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #005de1;
  --bs-btn-disabled-border-color: #005de1;
}
.btn-outline-primary {
  --bs-btn-color: #005de1;
  --bs-btn-border-color: #005de1;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #004380;
  --bs-btn-hover-border-color: #004380;
  --bs-btn-focus-shadow-rgb: 13,110,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #004380;
  --bs-btn-active-border-color: #004380;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #005de1;
  --bs-btn-disabled-bg: transparent;
  --bs-btn-disabled-border-color: #005de1;
  --bs-gradient: none;
}




html{overflow-x: hidden;}
body{overflow-x: hidden; min-height: 100vh; font-size: 14px; color: #000; background-color: #f9f9fb; font-family: "Poppins", sans-serif; font-weight: 400;}
a, a:active, a:focus, a:hover {outline: none; transition: all 0.5s ease; text-decoration: none;}
button, button:active, button:focus, button:hover {outline: none; box-shadow:none; transition: all 0.5s ease; text-decoration: none;}
.container{max-width: 1420px;}
.container-fluid{padding: 0px 20px;}

.btn-width-1{min-width: 120px;}
.btn-width-2{min-width: 150px;}
.btn-width-3{min-width: 180px;}

.fs-7{font-size: .8rem !important;}
.fs-8{font-size: .8rem !important;}
.pointer{cursor: pointer;}

.opacity-10{opacity: .10;}
.opacity-20{opacity: .20;}

.icon-200{width: 200px;}
.icon-150{width: 150px;}
.icon-140{width: 140px;}
.icon-130{width: 130px;}
.icon-110{width: 110px;}
.icon-120{width: 120px;}
.icon-100{width: 100px;}
.icon-90{width: 90px;}
.icon-80{width: 80px;}
.icon-70{width: 70px;}
.icon-60{width: 60px;}
.icon-50{width: 50px;}
.icon-40{width: 40px;}
.icon-30{width: 30px;}
.icon-35{width: 35px;}
.icon-25{width: 25px;}
.icon-20{width: 20px;}
.icon-15{width: 15px;}
.icon-10{width: 10px;}

.max-200{max-width: 200px;}
.max-300{max-width: 300px;}
.max-400{max-width: 400px;}
.max-500{max-width: 500px;}
.max-600{max-width: 600px;}
.max-600{max-width: 600px;}
.max-700{max-width: 700px;}
.max-800{max-width: 800px;}
.max-900{max-width: 900px;}
.max-1000{max-width: 1000px;}
.max-1100{max-width: 1100px;}
.max-1200{max-width: 1200px;}
.max-1300{max-width: 1300px;}

.fw-300{font-weight: 300;}
.fw-400{font-weight: 400;}
.fw-500{font-weight: 500;}
.fw-600{font-weight: 600;}
.fw-700{font-weight: 700;}
.fw-800{font-weight: 800;}

.leverate_box .container{max-width: 100%; padding: 0;}
.leverate_box .container .pt-4{padding-top: 0 !important;}
.leverate_box .container .pb-4{padding-bottom: 0 !important;}

.header_bg{position: absolute; left: 0; right: 0; top: 60px; z-index: -1; background: url(../img/back_light.png),radial-gradient(50% 50% at center top,#005de1 0%,#f9f9fb 100%); background-size: 100% 100%; height: 300px;}
.header_padding{padding-top: 65px;}
.header_logo{width: 140px;}

.welcome_box{min-height: calc(100vh - 250px);}
.box-link:hover{cursor: pointer; background: #f5f5f5}

.menu_link{padding: 0px; margin: 0px; list-style: inside;}
.menu_link li{margin-right: 25px;display: inline-block; position: relative;}
.menu_link li::before{background: #d6dae1; border-radius: 1px; content: ""; height: 16px; margin: auto;position: absolute;right: -14px;top: 6px; width: 2px;}
.menu_link li:last-child{margin-right: 0;}
.menu_link li:last-child::before{display: none;}
.menu_link li a{color: #8590a6; text-decoration: none;}
.menu_link li a:hover{color: rgba(var(--bs-primary-rgb))}

.top-header{border-bottom: 1px solid #cccccc40;}
footer{border-top: 1px solid #cccccc73;}

.slick-slide > div{padding: 15px 5px;}
.slick-prev::before, .slick-next::before{color: #000 !important; border: 1px solid #031c34; height: 40px; width: 40px; display: flex; border-radius: 5px; align-items: center; justify-content: center;}
.slick-prev {left: -40px !important;}

.card_height{min-height: 250px; box-shadow: rgb(230, 233, 246) 0px 6px 12px 0px; border-radius: 15px !important;}
.card_height .icon-60{margin: auto;}
.dropdown-item{cursor: pointer;}

.login-view{width: 100%;}
.form-label{font-weight: 600;}
.form-control::placeholder {opacity: .4;}

.form-control:focus{box-shadow: none;}
.form-control {padding: .675rem .75rem; font-size: 14px;}
.css-13cymwt-control{border: var(--bs-border-width) solid var(--bs-border-color) !important; min-height: 44px !important;}
.form-control:focus{border-color: #ccc;}
.form-select:focus{box-shadow: none;}
.form-select {padding: .675rem .75rem; font-size: 14px;}
.cursor-pointer{cursor: pointer;}

.eye_show_box{position: absolute; right: 16px; top: 12px; cursor: pointer;}
.theme_color{color: #005de1;}



.nav.nav-tabs{margin-bottom: 15px;}

.btn-toggle-nav li a{padding: 7px 15px; transition: unset; border-radius: 8px; overflow: hidden; position: relative; font-weight: 500; color: #505050; display: block;}
.btn-toggle-nav li a.active{background: #eeeef0; color: #000;}
.btn-toggle-nav li a:hover{background: #eeeef0; color: #000;}

.btn-toggle-nav li a::after{content: ""; opacity: 0; background-image: linear-gradient(to right, #142b23 0%, #005de1 51%, #142b23 100%);
  background-size: 200% 100%; width: 6px; position: absolute; left: -3px; top: 8px; bottom: 8px; border-radius: 16px;}
.btn-toggle-nav li a.active::after{opacity: 1;}
.btn-toggle-nav li a:hover::after{opacity: 1;}




.app_menu_list{ margin: 0;padding: 0; }
.app_menu_card .nav-item .nav-link{display: block;}
.app_menu_card .nav-item .nav-link{display: block; overflow: hidden; margin-bottom: 2px; margin-top: 2px; cursor: pointer; position: relative; color: #000 !important; width: 100%;  border-radius: 10px !important; padding: 7px 15px;}
.app_menu_card .nav-item .nav-link i {margin-right: 8px;font-size: 16px;}
.app_menu_card .nav-item .nav-link.active{background: #e5e4ec}
.app_menu_card .nav-item .nav-link:hover{background: #d1d3d747;}

.card-outer{background-color: #fafafc; padding: 20px 20px; border-radius: 15px;}

.arrow_list{list-style: none; padding: 0px; margin: 0px;}
.arrow_list li{ padding-right: 15px; font-weight: 600; padding-left: 30px; position: relative; margin-bottom: 10px;}
.arrow_list li::before{content: ""; filter: brightness(0) invert(0); background: url(../img/icon/check-mark.png) no-repeat; position: absolute; left: 0; top: 1px; height: 17px; width: 17px; background-size: contain;}
.arrow_list li:last-child{margin-bottom: 0;}

.card-header{background: transparent;}
.form-control.otp{margin: 0px 6px; width: 40px !important;}
.language-100 .btn{width: 100%;}
.inner_box_bg{background: #b8d0f4; border-radius: 15px;}
.inner_box_bg .opacity-50{opacity: .9 !important;}

.login_box_width{outline: rgba(0, 0, 0, 0.05) solid 0.0625rem; z-index: 11; position: relative; max-width: 500px; background:#fff; box-shadow: rgba(0, 0, 0, 0.02) 0rem 1.625rem;   margin: auto;  border-radius: 30px; padding: 25px;}
.login_box_width.register_box_width{max-width: 650px;}

.login_header{background: #fff; border-bottom: 1px solid #e5ecf2; z-index: 11; position: fixed; left: 0; right: 0; top:0; padding: 13px 0px;}
.login_background{height: 100%; border-radius: 0px; left: 0;  right: 0; top: 0; width: 100%; position: absolute;}
.login_background img{width: 100%; height: 100%;}
.login_box{position: relative;}

.circle-icon{border-radius: 50px; background: rgba(143, 131, 229, 0.2); width: 35px; height: 35px; display: flex; align-items: center; justify-content: center;}
.left-wallet-balance-bg{background: linear-gradient(105.4deg, rgba(0, 98, 255, 0.11) 0%, rgba(1, 188, 53, 0.04) 98.37%); border: 1px solid rgba(0, 98, 255, 0.16);}

.card {border-radius: 12px; box-shadow: rgb(230, 233, 246) 0px 2px 12px 0px; width: 100%; border: 1px solid #ccccccab;} 

.quick_action_box{background-image: linear-gradient(319.99deg, rgba(245, 167, 31, 0.79) 8.82%, rgb(247, 176, 84) 120.87%); border-radius: 10px;}
.quick_action_link{background: #ffffff38; cursor: pointer; padding: 10px 20px; border-radius: 5px;}
.quick_action_link h5{font-size: 14px;}

.gateway_tab{padding: 10px 15px; font-size: 17px; cursor: pointer; position: relative; border-radius: 10px; background: #cccccc96; border: 1px solid transparent;}
.gateway_tab.gateway_active::before{content: ""; height: 22px; width: 22px; position: absolute; right: -7px; top: -7px; background: url(../img/active-check.png) no-repeat; background-size: cover;}
.gateway_tab.gateway_active{border: 1px solid #005de1; background: #005de12b;}

.table > :not(caption) > * > * {padding: .7rem .7rem; border: none;}


.table > tbody {vertical-align: middle;}

.payment_active{position: relative;}
.payment_active::before{content: "\f633"; color: var(--bs-primary); font-family: bootstrap-icons; font-size: 30px; position: absolute; right: 0; top: -15px;}


.check_list{padding: 0px; margin: 0px; list-style: none;}
.check_list li{position: relative; font-size: 15px; padding-left: 35px; margin-bottom: 15px;}

.check_list li:last-child{margin-bottom: 0px;}
.btn.disabled {opacity: .4;}



.nav-tabs .nav-link {border: 1px solid #c4c4c4; font-weight: 500; color: #000; border-radius: 8px; padding: 8px 18px; min-width: 60px;}
.nav-tabs .nav-link:hover{border: 1px solid #005de1; background: transparent;}
.nav-tabs{padding-bottom: 10px;}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{
 background-size: 200% 100%;
  transition: all .5s; color: #fff; 
  border: none;
  background: #005de1 ;
}
.action_dropdown{background: transparent; border: none; font-size: 20px;}

.tab1-style .nav-link{border-radius: 0px; position: relative; border: 2px solid transparent !important;}
.tab1-style .nav-link.active{color: #005de1;background: transparent;}
.tab1-style .nav-link.active::before{content: ""; background: #005de1; position: absolute; left: 0; right: 0; bottom: -2px; height: 3px;}
.tab1-style .nav-link.active:hover{color: #005de1;}
.tab1-style .nav-link:hover{border: 2px solid transparent !important;}
.tab1-style{margin-bottom: 10px !important;}

.nav-tabs:hover{background-position: 100% 0; color: #fff;}

.alert .form-check {padding-left: 0 !important;}

.check-width-50 .form-check-inline{width: 45%; margin-bottom: 15px;}
.form-check-input {width: 1.3em; height: 1.3em; margin-top: 2px; margin-right: 10px; border: var(--bs-border-width) solid #a7a8a8;}
.form-check {padding-left: 2em;}

.kycaccordion .accordion-button{font-weight: 600; padding: 0; background: transparent}
.accordion-button:focus{outline: none; box-shadow: none; box-shadow: none !important; background: transparent !important; border-radius: inherit;}
.accordion-item{margin-bottom: 15px; position: relative; padding: 18px; overflow: hidden; border: 1px solid #e7e7e7 !important; border-radius: 15px !important;}
.accordion-body{padding: 0;margin-top: 20px; border-top: 1px solid #cccccc4a; padding-top: 20px;}
.accordion-button:not(.collapsed){background: transparent; box-shadow: none;}
.identity_icon {width: 52px; color: #000; padding: 12px; height: 52px; margin-right: 16px; flex-shrink: 0; display: flex; justify-content: center;  align-items: center; border-radius: 50%; background-color: rgba(29, 29, 29, 0.04);}
.identity_icon img{width: 100%; filter: brightness(0) invert(0);}
.btn-light {border: 1px solid #d8d8d8; background: transparent;}


.front-back-box{border: 1px solid #4b556333; text-align: center; cursor: pointer; padding: 1.5rem; width: 180px; height: 180px; border-radius: 10px;}
.front-back-box:hover{background: #f5f0fe;}
.accordion-button:not(.collapsed) {color: var(--bs-accordion-btn-color);}
.ribbon-wrapper {position: absolute; top: -5px; right: 8px;}
.ribbon-wrapper .ribbon-section {border-radius: 10px; color: #fff; text-align: center; padding: 5px 0;  width: 120px; font-size: 10px; font-weight: 600;}
.ribbon-section.kyc-approved{background: #1E93064F; color: #1E9306}
.ribbon-section.kyc-pending{background: #bd9a2c6e; color: #bd9a2c;}
.ribbon-section.kyc-rejected{background: #BD10214D; color: #BD1021;}
.ribbon-section.kyc-not-Uploaded{background: #908e8e4d; color: #908e8e;}
.ribbon-section.recent-active{background-image: linear-gradient(to right, #142b23 0%, #005de1 51%, #142b23 100%);
  background-size: 200% 100%;}

.modal-title{font-size: 17px !important;}
.document-img-w{width: 50px;}

.avtar-circle {position: relative; width: 40px; height: 40px; border-radius: 50%; text-align: center;  font-size: 16px; font-weight: 500; display: flex; align-items: center; justify-content: center; transition: 0.3s;}
.avtar-circle:hover {background: #f5f0fe5c;}
.avtar-circle img{width: 100%; border-radius: inherit; height: 100%;}

.bell-circle {border: 1px solid rgba(0, 0, 0, 0.12); background: #f9f9f9; cursor: pointer; width: 38px; height: 38px; border-radius: 50%; position: relative; display: flex; align-items: center; justify-content: center;}
.bell-circle:hover{color: #005de1;}


.notification_count{background: #005de1; color: #fff; border-radius: 50%; height: 17px; width: 17px; font-size: 10px; display: flex; align-items: center; justify-content: center; position: absolute; right: 3px; top: 8px;}

.Verification_bgbox{padding: 20px; border-radius: 10px; width: 410px;}
.Verification_bgbox.bg-danger{background: #fde8e9 !important;}
.Verification_bgbox.bg-success {background: #ddecd2 !important;}
.Verification_bgbox_icon{width: 65px;}

.offcanvas-header .btn-close {display: flex; opacity: 1; align-items: center; justify-content: center; z-index: 1000; border-radius: 100%; cursor: pointer;}
.offcanvas-header .btn-close:hover { transform: rotate(-90deg);}
.offcanvas-end{box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px; border: none !important;}
.Notification_box{box-shadow: rgb(230, 233, 246) 0px 6px 12px 0px; background-color: rgba(255, 255, 255, 0.65); padding: 20px; border-radius: 30px;}



.dropdown-link{display: block; color: #000; 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:#e8e8e8; color: #005de1;}
.dropdown-link.active{background: #e8e8e8; color: #005de1;}


.paymentsetting_box{background:linear-gradient(270.03deg, rgb(230, 230, 230) 2.03%, rgba(79, 119, 84, 0.25) 97.04%); position: relative; padding: 20px; border-radius: 10px;}
.paymentsetting_box .table-crypto{width: 45px; height: 45px;}
.paymentsetting_box .wallet-btn{padding: 5px 12px; display: inline-block; font-size: 13px; background:rgba(29, 29, 29, 0.1);  border-radius: 20px; cursor: pointer;}
.paymentsetting_box .wallet-btn:hover{background: rgba(29, 29, 29, 0.17);}
.paymentsetting_box_btm{margin-top: 20px;}

.qr_code_box{border: 1px solid #4b556333; margin: auto; text-align: center; cursor: pointer; padding: 5px; width: 150px; height: 150px; border-radius: 10px;}
.qr_code_box:hover{background: #fff;}



.wallet_bg{background: linear-gradient(270.03deg, rgba(255, 186, 211, .25) 2.03%, rgba(186, 134, 253, .25) 97.04%); box-shadow: 0px 0px 6px 2px #ccc; border-radius: 20px;}

.wallet_border_box{border: 2px dashed #fff; padding: 15px 20px; border-radius: 20px; background: linear-gradient(to right, #ffffff, #ffffff), linear-gradient(to right, #373ecc, #7441d9, #aa44e4, #7441d9); background-clip: padding-box,border-box; background-origin: padding-box,border-box;}
.wallet_border_box .wallet_address{cursor: pointer; color: #005de1a6;}
.wallet_border_box .wallet_address span{background-color: #fdfcfc; color: #005de1; border-radius: 50px; border: 1px solid #c7d4dd;width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; cursor: pointer; }


.pagination .page-link{padding: 3px 10px;}
.no-data-found-img{width: 100px;}


.app-icon{width: 60px;}
.dashboard-user{width: 45px; font-size: 20px; height: 45px; border-radius: 50%; text-align: center; display: flex; align-items: center; justify-content: center;}
.dashboard-lien-box{padding: 30px 33px; z-index: 1; border-radius: 10px; background: linear-gradient(105.4deg, rgba(0, 98, 255, 0.11) 0%, rgba(1, 188, 53, 0.04) 98.37%); border: 1px solid rgba(0, 98, 255, 0.16); position: relative; overflow: hidden;}

.crypto-fiat-w{margin-right: 48px; flex: 1 1 0%;}
.crypto-fiat-arrow{border: 1px solid rgba(29, 29, 29, 0.12); width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; cursor: pointer;}
.uid-lien{border-left: 1px solid #cccccc94;}

.not-found-img{width: 100%;}
.profile_img{width: 80px; height: 80px; margin: auto;  position: relative; font-size: 40px; background-image: linear-gradient(to right, #142b23 0%, #005de1 51%, #142b23 100%);
  background-size: 200% 100%; color: #fff;  border-radius: 50%; text-align: center; display: flex; align-items: center; justify-content: center;}
.profile_img img{width: 100%; height: 100%; border-radius: inherit;}
.profile_img-edit{border: 1px solid rgba(29, 29, 29, 0.12); position: absolute; right: 0; top: 0; background: #fff; width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; cursor: pointer;}

.loader-container {position: fixed; display: none; animation: fadeOut 2s ease 2s forwards; top: 0; left: 0; z-index: 9999; right: 0; bottom: 0; background: #00000075; display: flex; align-items: center;justify-content: center;}


.loader {
    width: 30px;
    height: 30px;
    border: 4px solid transparent;
    border-top: 4px solid var(--primary);
    border-radius: 50%;
    animation: spin 1s linear infinite, glow 1.5s ease-in-out infinite alternate;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes glow {
    0% { box-shadow: 0 0 10px var(--primary); }
    100% { box-shadow: 0 0 30px var(--primary); }
}
label {font-weight: 500;}
.checkbox {opacity: 0; position: absolute;}
.checkbox-label { background-color: #ddd; width: 45px; height: 22px; border-radius: 50px; position: relative; padding: 5px; cursor: pointer; display: flex; justify-content: space-between; align-items: center;}
.checkbox-label .ball { background-color: #8b8b8b; width: 18px; height: 18px; position: absolute; left: 2px; top: 2px; border-radius: 50%; transition: transform 0.2s linear;}
.checkbox:checked + .checkbox-label .ball {transform: translateX(24px);}
.checkbox-label i{margin-right: 0 !important; font-size: 14px !important;}

.document_input{border: 2px dashed #A2A2A2; position: relative; cursor: pointer; background: #FFFFFF; padding: 20px; min-height: 10.93rem; border-radius: 10px;}
.document_input_text{position: absolute; padding-top: 16px; left: 0; right: 0; margin: auto; text-align: center;}
.document_input .img-uplaod-height{width: 70px;}


.img-2x { width: 2rem; height: 2rem;}
.page-title{font-size: 21px;}
.title-text{margin-bottom: 20px;}

thead tr th{background-color: #f3f4f5  !important;}
thead tr th strong {font-weight: 500;}
.modal-body .modal-body{padding: 0;}
.c_card_box{background: #b8d0f4; border-radius: 15px;}

.c_card_box.card-add{border: 1px solid #005de1; cursor: pointer; background: linear-gradient(146deg,rgba(247,166,0,.05) 22.28%,rgba(247,166,0,0) 61.15%),#fff;}

.c_card_box.card-deposit{border: 1px solid #44d40f; cursor: pointer; background: linear-gradient(146deg,rgba(66, 247, 0, 0.14) 22.28%,rgba(247,166,0,0) 61.15%),#fff}
.c_card_box.card-withdraw{border: 1px solid #dc3545; cursor: pointer; background: linear-gradient(146deg,rgba(220, 53, 69, 0.1) 22.28%,rgba(247,166,0,0) 61.15%),#fff;}
.menu-open .collapse{display: block;}
.menu-open .menu-arrow::before {
  transform: rotate(90deg);
}

.table:last-child{margin-bottom: 0;}
.account-tab img{width: 100px; transition: all 0.5s ease;}
.account-tab{align-items: center;}

.account-tab.nav-tabs .nav-link{padding: 7px 10px; position: relative;}
.account-tab.nav-tabs .nav-link.active{background: #fff; border: 1px solid #005de1;}

.package-box{border-radius: 15px; padding: 15px; border: 1px solid #005de1;
 background: linear-gradient(180deg,#005de12e,#fff);
  border-radius: 15px;}

.pl-title{font-weight: 500; font-size: 20px; text-align: center; background: #005de1; border-radius: 10px; color: #fff; padding: 5px;}

.pl-container_text1 {margin-bottom: 10px; font-size: 13px; color: #3e3d3d; border: 1px solid #8a8989; padding: 5px 15px; border-radius: 5px;}
.pl-container_text1:last-child{margin-bottom: 0px;}

.play-app-store-icon{display: flex; gap:6px; flex-wrap: wrap; padding: 0; margin: 0;}
.play-app-store-icon li{display: block;}
.play-app-store-icon li a{display: block; border: 2px solid #acaaab; width: 100px; border-radius: 5px;}
.play-app-store-icon li a img{width: 100%; border-radius: inherit;}
.flex-1{flex: 1 1 0%;}

.slick-dots li{margin: 0 !important;}
.slick-dots {position: unset !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-messages { display: flex; flex-direction: column; padding: 5px; overflow-y: auto; gap: 2px; height: 100%;}
 .user-message {display: flex;justify-content: end;}
 .user-message-text {display: inline-block; width: fit-content;border-radius: 5px;padding: 0.5rem; background: #e1e1e133; max-width: 16rem;}
 .wallet-address {word-wrap: anywhere;}
 .bot-message {display: flex; justify-content: start;flex-direction: column; gap: 2px;}
 .bot-message-text { width: fit-content; border-radius: 5px; padding: 0.5rem; background: #e1e1e133; max-width: 16rem;}
 .chat-input { display: flex; padding: 3px; gap: 3px;}
 .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: 60vh; display: flex; overflow: auto;}
 .chatRaise { justify-content: flex-end; display: flex; margin: 5px;}
 .chatRaiseM {display: none; justify-content: flex-end; display: flex; margin: 5px;}
 .chatHead {display: none;}
 .chatListM {display: block; opacity: 1;}
 .chat_ticket_h{height: 60vh;}
 @media only screen and (max-width: 990px) {
   .chatListM { z-index: 1; position: absolute !important; display: block; background: #000;height: inherit; min-width: 200px !important;}
   .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;}
 }








