/* Merchant management bugs */
.table-responsive #datatable-basic .dropdown{ position: inherit !important; }
.table-responsive #datatable-basic .dropdown a.dropdown-item span.btn{ margin-right: 5px;}

/* ============================= */
/* 🚀 Start: Sathyam Styles 31-03-2025 🚀  */
/* ============================= */
.btn.btn-secondary:hover{ background-color:#1C92B7 !important;}
.btn-warning:hover{ background-color: #C4933A !important;}
.btn-success:hover{ background-color: #1e9976 !important;}
.admin-card1 .payinpayout{ background:#fff; border-radius:10px; padding:25px;}
.admin-card1 .payin-dashboard-background .card-header span.icon{ width:32px; height:32px; background:#f1ffeb; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin-right: 13px;}
.admin-card1 .payin-dashboard-background .card-header span.icon img{ width:18px; }
.admin-card1 .common-card-title{ display: flex; align-items: center; font-size: clamp(12px,0.833vw,16px);}
.admin-card1 .payout-dashboard-background .card-header span.icon{ width:32px; height:32px; background:#fff2f2; display: flex; align-items: center; justify-content: center; border-radius: 50%; margin-right: 13px;}
.admin-card1 .payout-dashboard-background .card-header span.icon img{ width:18px;}
.admin-card1 .card.custom-card .card-header{ padding:0;}
.admin-card1 .border-inline-end-dashed{ border: 1.5px solid #E6FFDB; border-radius: 10px; display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; padding:26px 0 25px 0; }
.admin-card1 .border-inline-end-dashed p.payin-text-muted{ font-size: clamp(9px,0.651vw,12.5px); font-weight: 700 !important; color:#525252;}
.admin-card1 .border-inline-end-dashed p.fw-semibold{ font-size:clamp(16px,1.25vw,24px); font-weight: 700; color:#525252; margin:0 0 0 0;}
.admin-card1 .border-start-dashed{background: #F8FFF5; border-radius: 10px; display: flex; flex-direction: column-reverse; align-items: center; justify-content: center; padding:26px 0 25px 0; position: relative;}
.admin-card1 .border-start-dashed div >  p.fw-semibold{ color:#65A300; font-size: clamp(9px,0.651vw,12.5px);}
.admin-card1 .border-start-dashed p.fw-semibold{ font-size:clamp(16px,1.25vw,24px); font-weight: 700 !important; color:#525252; margin:0 0 0 0;}
.admin-card1 .border-start-dashed .flex-between{ position: absolute; right:18px; top:12px;}
.admin-card1 .border-start-dashed .flex-between span.text-success{ color: #65A300 !important; font-size: clamp(10px,0.625vw,12px);}
.admin-card1-bottom{ margin-top:10px; }
.admin-card1-bottom .acb{ display: flex; margin:0 0 10px 0;}
.admin-card1-bottom .acb:last-child{ margin-bottom: 0;}
.admin-card1-bottom .acb-left{ border-radius: 10px 0px 0px 10px; border: 1.5px solid #E6FFDB; width:50%; font-size: clamp(10px,0.729vw,14px); color:#525252; padding:15px 0 15px 15px; margin: 0;}
.admin-card1-bottom .acb-right{width:50%; border-radius: 0px 10px 10px 0px; background: #F8FFF5; font-size: clamp(12px,0.833vw,16px); font-weight: 700; color:#525252; text-align: center; padding:15px 0 15px 0;  margin: 0;}
.admin-card1 .payout-border-bottom .border-inline-end-dashed{ border: 1.5px solid #FFF3F2;}
.admin-card1 .payout-border-bottom .border-start-dashed{ background: #FFFAF9;}
.admin-card1 .border-inline-end-dashed p.payout-text-muted{ font-size: clamp(9px,0.651vw,12.5px); font-weight: 700 !important; color:#525252;}
.admin-card1 .border-start-dashed div > p.payout-text.fw-semibold{ color:#D40000;}
.payout-border-bottom + .admin-card1-bottom  .acb-left{ border: 1.5px solid #FFF3F2;}
.payout-border-bottom + .admin-card1-bottom  .acb-left{ border: 1.5px solid #FFF3F2;}
.payout-border-bottom + .admin-card1-bottom .acb-right{ background: #FFFAF9;}

.admin-card2{ border-radius:10px; padding:25px 25px 10px 25px;}
.admin-card2 .top-payin-header .card-title,.admin-card2 .top-payout-header .card-title{ font-size: clamp(12px,0.833vw,16px) !important; font-weight: 600 !important; color:#525252 !important;}
.admin-card2 .top-payin-header .card-title:before,.admin-card2 .top-payout-header .card-title:before{ display:none !important; }
.card.custom-card.admin-card2 .top-payin-header,.card.custom-card.admin-card2 .top-payout-header{ background:none !important; border:none !important; padding:0 !important; margin:0 0 15px 0 !important;}
.card.custom-card.admin-card2 .card-body{ padding:0;}
.card.custom-card.admin-card2 .admin-card2-box{ border-radius: 10px; border: 1.5px solid #E6FFDB; text-align: center; width:24%; margin-right:1%; margin-bottom: 16px; padding:18px 0 15px 0; }
.admin-card2-box .admin-card2-success{ font-size: clamp(9px,0.677vw,13px); color:#525252; margin:0 0 0 0;}
.admin-card2 .card-body{ display: flex !important; flex-wrap: wrap;}
.admin-card2-box .admin-card2-box-title{ font-size:13px; color:#525252; margin:0 0 7px 0;}
.admin-card2-box .admin-card2-box-price{ font-size:clamp(16px,1.25vw,24px); font-weight: 700; color:#525252; margin:0 0 0 0;}
.admin-card2-box .admin-card2-success{ font-size: clamp(9px,0.677vw,13px); color:#525252; margin:0 0 0 0;}
.admin-card2-box .admin-card2-success span{ font-size: clamp(9px,0.677vw,13px); color:#00B457 !important; background:none !important; padding:0 !important;}
.top-payout-header + .card-body .admin-card2-box .admin-card2-success span{ color: #D40000 !important;}
.top-payout-header + .card-body .admin-card2-box{ border: 1.5px solid #FFF0EF !important;}

.payin-merchant{ width:49%;}
.payout-merchant{ width:49%;}
.commissions-earned{ }
.commissions-earned .header{ display: flex; align-items: center;}
.commissions-earned .header .s-icon{ margin-right: 1.04vw;}
.commissions-earned h3{ font-size: clamp(12px,0.833vw,16px); color:#525252; font-weight: 600; margin-bottom: 15px;}
.commissions-earned .ce-graph{ display: flex; border-bottom:2px solid #f8f8f8; justify-content: space-between; padding-bottom:31px;}
.ce-graph-left{ width:28.7%}
.ce-graph-left img{ max-width: 100%;}
.commissions-earned .ce-graph .ce-graph-right{ width:66.4%;}
.commissions-earned .ce-graph .ce-graph-right ul{ width:100%; padding:0; margin: 0;}
.commissions-earned .ce-graph .ce-graph-right ul,.commissions-earned .ce-graph .ce-graph-right ul li{list-style: none; }
.commissions-earned .ce-graph .ce-graph-right ul li{ display: flex; align-items: center; justify-content: space-between; margin-bottom: 9px; position: relative;}
.commissions-earned .ce-graph .ce-graph-right ul li.gst{ margin-top: -8px;}
.commissions-earned .ce-graph .ce-graph-right ul li.gst p,.commissions-earned .ce-graph .ce-graph-right ul li.gst span{ font-size:12px; font-weight: 400; color:rgb(106, 148, 161)}
/* .commissions-earned .ce-graph .ce-graph-right ul li:nth-child(1):before{ content:' '; width:10px; height:10px; background:#86E8DF; border-radius:50px; position: absolute; left:-20px; top:6px;}
.commissions-earned .ce-graph .ce-graph-right ul li:nth-child(2):before{ content:' '; width:10px; height:10px; background:#FFCE6D; border-radius:50px; position: absolute; left:-20px; top:6px;}
.commissions-earned .ce-graph .ce-graph-right ul li:nth-child(3):before{ content:' '; width:10px; height:10px; background:#C386E8; border-radius:50px; position: absolute; left:-20px; top:6px;}
.commissions-earned .ce-graph .ce-graph-right ul li:nth-child(4):before{ content:' '; width:10px; height:10px; background:#869CFF; border-radius:50px; position: absolute; left:-20px; top:6px;} */
.commissions-earned .ce-graph .ce-graph-right ul li p{  margin: 0; font-size: clamp(11px,0.78vw,15px); font-weight: 600; color:#525252}
.commissions-earned .ce-graph .ce-graph-right ul li span{ font-weight: 600; font-size: clamp(12px,0.833vw,16px); color:#525252;}
.commissions-earned .ce-month{ padding:25px 0 23px 0; border-bottom:2px solid #f8f8f8;}
.commissions-earned .ce-month:last-child{ border-bottom: none;}
.commissions-earned .ce-month h3{ font-size: clamp(12px,0.833vw,16px); color:#525252; font-weight: 600; margin:0 0 7px 0;}
.commissions-earned .ce-month ul{ margin:0; padding:0;}
.commissions-earned .ce-month ul,.commissions-earned .ce-month ul li{ list-style: none;}
.commissions-earned .ce-month ul li{ display: flex; align-items: center; justify-content: space-between; padding:14px 15px 12px 15px;}
.commissions-earned .ce-month ul li p,.commissions-earned .ce-month ul li span{ width:33.3%; text-align: center;}
.commissions-earned .ce-month ul li p{ text-align: left;}
.commissions-earned .ce-month ul li:nth-child(odd){background: #FBFBFB;}
.commissions-earned .ce-month ul li p{ margin:0; padding:0; font-size: clamp(11px,0.78vw,15px); color:#525252;}
.commissions-earned .ce-month ul li span{ font-weight: 600; font-size: clamp(12px,0.833vw,16px); color:#525252;}
.dashboard-recent-transations{ margin:0 0 10px 0; background:#fff; border-radius:10px; padding: 23px 24px 23px 24px; }
.dashboard-recent-transations h3{ margin:0 0 6px 0; font-size: clamp(12px,0.833vw,16px); font-weight: 600; color:#525252;}
.table-pattern1{ width:100%;}
.table-pattern1 th{ font-size: clamp(11px,0.78vw,15px); color:#525252; padding-bottom:2px; padding:12px 10px 11px 10px; text-align: center;}
.table-pattern1 td{ font-size:15px; color:#525252; padding:12px 10px 11px 10px; text-align: center;}
.table-pattern1 th:nth-child(1),.table-pattern1 td:nth-child(1){ text-align: left; padding-left:54px;}
.table-pattern1 tr:nth-child(odd) td{ background: #FBFBFB;}
.table-pattern1 tr:nth-child(even) td{ background: #fff;}
.table-pattern1 tr td span.success{ border-radius: 5px; background: #EBFFEF; font-size: 12px; color:#00B457; padding:2px 12px;}
.table-pattern1 tr td.amount{ font-weight: 600; font-size: clamp(12px,0.833vw,16px);}
.table-pattern1 tr td p{ padding:0; margin: 0; position: relative;} 
.table-pattern1 tr td p.received,.table-pattern1 tr td p.sent{ position: relative; }
.table-pattern1 tr td p.received:before{ content:' '; background:url(../../images/payin.svg) no-repeat left top; width:22px; height: 22px; position: absolute; left:-44px; top:50%; transform:translateY(-50%); }
.table-pattern1 tr td p.sent:before{ content:' '; background:url(../../images/payout.svg) no-repeat left top; width:22px; height: 22px; position: absolute; left:-44px; top:50%; transform:translateY(-50%); }
.statistic-box{ width:24.3%; background:#fff; border-radius:10px; display: flex; align-items: center; padding:26px 24px; border:1px solid #e4e7ec;}
.statistic-box img{ max-width: clamp(40px,3.22vw,62px);}

/* select */
.chosen-container-single .chosen-single,.chosen-container-active.chosen-with-drop .chosen-single,.chosen-container-multi .chosen-choices{border:1px solid #e9edf6 !important; color:#333335; background:#fff; font-size: 0.875rem; line-height: 1.6; border-radius: 0.35rem; padding:.375rem .75rem; height: auto; box-shadow: none;}
.chosen-container-single .chosen-single div b,.chosen-container-active.chosen-with-drop .chosen-single div b{ background-position: 0 10px;}
.chosen-container .chosen-results li.highlighted{ background:#845adf}.min-width: 100px;
.chosen-container-multi .chosen-choices li.search-field input[type="text"]{ height:auto;}
.app-content{min-height: 100vh;}
.chosen-container{min-width: 150px;}
.choices__inner{min-width: 150px;}
.form-group{min-width: 150px;}
select,
::picker(select) {
  appearance: base-select !important;
  border:none;
   appearance: none;           /* Remove default arrow (for modern browsers) */
  -webkit-appearance: none;   /* Safari/Chrome */
  -moz-appearance: none;    
}
.form-select option:hover{background:#845adf; color:#fff;}
select::picker-icon {
  border:none;
  color:green !important;
  display: none !important;
}

.custom-modal-width {
  max-width: 35% !important;
  width: 100%;  
}

.custom-modal-outer {
  display: flex !important;
  align-items: center;
  justify-content: center;
}

/* ============================= */
/* 🚀 End: Sathyam Styles 31-03-2025 🚀  */
/* ============================= */
/* ============================= */
/* 🚀 Start: Sathyam Bug fixes 04-11-2025 🚀  */
/* ============================= */
.flashes h2{ font-size: 20px; text-transform: capitalize;}
.modal-body .form-group label{ margin-bottom: 5px;}
.modal-body .form-group{ margin-bottom: 10px;}
.modal-footer button.btn.btn-default{border:1px solid #e9edf6;}
.modal-footer button.btn.btn-default:hover{background:#e9edf6}
.modal-footer .error{ display: block; width:100%;}
.page-header-breadcrumb h1{ color:rgb(51, 51, 53);}
.breadcrumb .breadcrumb-item a:hover{ color:#3F45A9; font-weight: 600;}
#datatable-basic td,#datatable-basic th{ word-wrap: break-word; /* Legacy */
  overflow-wrap: break-word; /* Modern */   /* Fixed or percentage width */
  overflow-wrap: break-word; white-space: normal !important;
  overflow-wrap: break-word; max-width: 250px;}
/* ============================= */
/* 🚀 End: Sathyam Bug fixes */
/* ============================= */

/* new dashboard design 23-04-2025 */
.new-dashboard{ font-family: "Outfit", sans-serif; font-optical-sizing: auto;}
.dashboard-merchant{ display: flex; justify-content: space-between; margin-bottom: 30px;}
.merchant-box{ width:49%;}
.merchant-box .header{ display: flex; align-items: center; background: #FFFFFF; border: 1px solid #D3D6F0; border-radius: 5px 5px 0px 0px; padding:0.989vw 1.5625vw 0.989vw 1.35vw; }
.merchant-box .header .s-icon{ margin-right: 1.04vw;}
.merchant-box .header .s-icon img{ width:clamp(20px,1.5625vw,30px)}
.merchant-box .header h3{ font-weight: 700; font-size: clamp(12px,0.833vw,16px); letter-spacing: 0.8px; color: #1E203D; text-transform: uppercase; margin:0;}
.merchant-box .orders-table{width: 100%; border-collapse: separate; border-spacing: 0.781vw; background: #F6F7FF; border: 1px solid #D3D6F0; border-radius: 0px 0px 5px 5px;}
.merchant-box .orders-table tr{ background:none !important; }
.merchant-box .orders-table th{ text-align: center; font-weight: 600; font-size: clamp(10px,0.729vw,14px); color: #2C3189; text-transform: uppercase; background:none;}
.merchant-box .orders-table td{ background: #FFFFFF; border-radius: 5px; padding:12px 0 15px 0;}
.merchant-box .orders-table td:nth-child(1){ font-weight: normal; font-size:clamp(15px,1.30vw,25px); color: #2C3189; text-align: center;}
.merchant-box .orders-table td:nth-child(2) p{ margin: 0; font-weight: normal; font-size: clamp(10px,0.729vw,14px); color: #1E203D; text-align: center;}
.merchant-box .orders-table td:nth-child(2) span{ font-weight: normal; font-size: clamp(10px,0.729vw,14px); color: #1E203D; text-align: center; display: block; text-align: center;}
.merchant-box .orders-table td:nth-child(3){ font-weight: normal; font-size: clamp(10px,0.729vw,14px); color: #1E203D; text-align: center;}
.merchant-box .orders-table td:nth-child(4){ position: relative;}
.merchant-box .orders-table td:nth-child(4) p{ margin: 0; font-weight: normal; font-size: clamp(10px,0.729vw,14px); color: #1E203D; text-align: center;}
.merchant-box .orders-table td:nth-child(4) span.percentage_positive{ position: absolute; right: 12px; bottom: 3px; font-weight: 600; font-size: clamp(10px,0.729vw,14px); color: #039855;}
.merchant-box .orders-table td:nth-child(4) span.percentage_negative{ position: absolute; right: 12px; bottom: 3px; font-weight: 600; font-size: clamp(10px,0.729vw,14px); color: #C11A1A;}
/* dashboard volume */
.dashboard-volumes{ margin-bottom: 30px;}
.volume-box .header{ display: flex; align-items: center; background: #FFFFFF; border: 1px solid #D3D6F0; border-radius: 5px 5px 0px 0px; padding:0.989vw 1.5625vw 0.9375vw 1.354vw;}
.volume-box .header .s-icon{ margin-right: 1.04vw;}
.volume-box .header .s-icon img{ width:clamp(20px,1.40vw,27px)}
.volume-box .header h3{ font-weight: 700; font-size: clamp(12px,0.833vw,16px); letter-spacing: 0.8px; color: #1E203D; text-transform: uppercase; margin:0 0 0 0;}
.volume-boxes-wrapper{ background: #F6F7FF; border: 1px solid #D3D6F0; display: flex;  flex-wrap: wrap; padding:2.083vw;}
.volume-boxes-wrapper .admin-card2-box{ background: #FFFFFF; border: 1px solid #D3D6F0; width:15.1%; margin-right: 1.8%; min-width:220px; margin-bottom: 10px;  }
.volume-boxes-wrapper .volume-title{ padding:1.09vw 0 0.989vw 1.77vw;}
.volume-boxes-wrapper .admin-card2-box:nth-child(6){ margin-right: 0;}
.volume-boxes-wrapper .admin-card2-box h3{ font-weight: 600; font-size: clamp(10px,0.729vw,14px); color: #1E203D; margin:0 0 7px 0;}
.volume-boxes-wrapper .admin-card2-box h4{ font-weight: 700; font-size: clamp(12px,0.833vw,16px); color: #2C3189; text-transform: uppercase;}
.volume-boxes-wrapper .admin-card2-box p.admin-card2-success{  background:url(../../images/success-icon.png) no-repeat left 1px; background-size:clamp(10px,0.729vw,14px) clamp(10px,0.729vw,14px); padding:0 0 0 1.04vw; font-weight: 600; font-size: clamp(10pxm,0.625vw,12px); color: #1E203D; }
.volume-boxes-wrapper .admin-card2-box .volume-success{border-top:1px solid #d3d6f0; padding:0.520vw 0 0.520vw 2.083vw;}
.volume-boxes-wrapper .admin-card2-box p span{ font-weight: 600; font-size: clamp(10pxm,0.625vw,12px); color: #039855;}
/* commissions earned */
.commissions-earned{ margin-bottom: 30px;}
.commissions-earned .header{ background: #FFFFFF; border: 1px solid #D3D6F0; border-radius: 5px 5px 0px 0px; padding:0.937vw 1.5625vw 0.989vw 1.35vw; }
.commissions-earned .header h3{ font-weight: 700; font-size: clamp(12px,0.833vw,16px); letter-spacing: 0.8px; color: #1E203D; text-transform: uppercase; padding:0 0 0 0; margin:0 0 0 0;}
.commission-content{ background: #F6F7FF; border: 1px solid #D3D6F0; display: flex; justify-content: space-between;}
.comission-content-left{ width:65.2%;}
.comission-content-right{ width:30.4%; display: flex; align-items: center;}
.comission-content-left table{ width:100%; border-collapse: collapse;}
.comission-content-left table tr{ background:none !important;}
.comission-content-left table th:first-child{ text-align: left; background: #FFFFFF; font-weight: 700; font-size: clamp(10px,0.729vw,14px); color: #1E203D; text-transform: uppercase; padding:14px 0 12px 35px;}
.comission-content-left table td:first-child{ text-align: left; background: #FFFFFF; font-weight: 500; font-size: clamp(12px,0.833vw,16px); color: #2C3189; padding:14px 0 12px 35px;}
.comission-content-left table th{ font-weight: 700; font-size: clamp(10px,0.729vw,14px); color: #2C3189; text-transform: uppercase; text-align: center; border:1px solid #ced2f0; padding:14px 0 12px 0;}
.comission-content-left table td{ text-align: center; font-weight: 700; font-size: clamp(10px,0.729vw,14px); color: #1E203D; border:1px solid #ced2f0; padding:14px 0 12px 0;}
.comission-content-left table td span{ display: block; font-size: 12px; font-weight: 500; color: #2C3189;}
/* kyc approved  */
.dashboard-statistics{ display: flex; justify-content: space-between; margin-bottom: 30px;}
.kyc-approved{ width:49%;}
.kyc-approved .header{ background: #FFFFFF; border: 1px solid #D3D6F0; border-radius: 5px 5px 0px 0px; display: flex; align-items: center; padding:0 0 0 27px;  }
.kyc-approved .header .s-icon{ margin-right: 1.04vw;}
.kyc-approved .header .s-icon img{ width:clamp(20px,1.71vw,33px);}
.kyc-approved .header h3{ margin:0; font-weight: 700; font-size: clamp(12px,0.833vw,16px); letter-spacing: 0.8px; color: #1E203D; text-transform: uppercase;}
.kyc-approved .header h6{ margin:0; font-weight: 700; font-size: clamp(16px,1.5625vw,30px); letter-spacing: 1.5px; color: #FFFFFF; text-transform: uppercase; background: #039855; border-radius: 0px 5px 0px 0px; margin-left: auto; padding:8px 33px 11px 28px; display: flex; align-items: center}
.blinking-dot { display: inline-block; height: 11px; width: 11px; background-color: #f7ff00; border-radius: 50%; margin-right: 1.04vw; animation: blink 1s infinite;}
@keyframes blink {
  0%, 100% {
      opacity: 1;
  }
  50% {
      opacity: 0;
  }
}
.kyc-approved .kyc-body{ background: #F6F7FF; border: 1px solid #D3D6F0; border-radius: 5px; display: flex;}
.kyc-approved .kyc-body .kyc-box{ width:33.3%; border-right:1px solid #dde0f4; position: relative; padding:1.51vw 0 1.35vw 2.08vw;}
.kyc-approved .kyc-body .kyc-box:last-child{ border-right: none;}
.kyc-approved .kyc-body .kyc-box h3{ font-weight: 600; font-size: clamp(12px,0.729vw,14px); color: #1E203D; margin:0 0 9px 0;}
.kyc-approved .kyc-body .kyc-box h6{ font-weight: 500; font-size: clamp(14px,1.04vw,20px); color: #2C3189; text-transform: uppercase; margin:0;}
.kyc-approved .kyc-body .kyc-box:nth-child(2) h6{ color: #C7950F;}
.kyc-approved .kyc-body .kyc-box:nth-child(2) h6{ color: #C11A1A;}
.kyc-approved .kyc-body .kyc-box .s-icon{ position: absolute; right:1.197vw; top:0.9375vw;}
.kyc-approved .kyc-body .kyc-box .s-icon img{ width:clamp(14px,1.09vw,21px)}
/* payinout */
.payinout-wrapper{ display: flex; justify-content: space-between; margin-bottom: 30px;}
.payinout-box{ width:49%; border:1px solid #D3D6F0;}
.payinout-box .header{ background: #FFFFFF; border: 1px solid #D3D6F0; border-radius: 5px 5px 0px 0px; display: flex; align-items: center; padding:9px 30px 17px 27px;}
.payinout-box .header .s-icon{ margin:0 1.04vw 0 0;}
.payinout-box .header .s-icon img{ width:clamp(20px,1.66vw,32px);}
.payinout-box .header h3{ font-weight: 700; font-size: clamp(12px,0.833vw,16px); letter-spacing: 0.8px; color: #1E203D; text-transform: uppercase; margin: 0; padding:5px 0 0 0;}
.payinout-monthly{ display: flex; justify-content: space-between; background: #F6F7FF;  padding:clamp(10px,1.5625vw,30px); }
.payinout-monthly-box{ background: #FFFFFF; border: 1px solid #D3D6F0; width:31.4%;}
.payinout-monthly-box-title{ padding:1.04vw 0 0.729vw 1.71vw;}
.payinout-monthly-box-title h3{ font-weight: 600; font-size:clamp(12px,0.729vw,14px); color: #1E203D; margin: 0 0 4px 0;}
.payinout-monthly-box-title h4{ font-weight: 600; font-size: clamp(12px,0.833vw,16px); color: #2C3189; text-transform: uppercase; margin: 0;}
.payinout-monthly-box-success{ border-top:1px solid #d3d6f0; padding:0.520vw 0 0 1.71vw;}
.payinout-monthly-box-success p{  background:url(../../images/success-icon.png) no-repeat left 1px; background-size:14px 14px; padding:0 0 0 20px; font-weight: 600; font-size: 12px; color: #1E203D; }
.payinout-monthly-box-success p span{ font-weight: 600; font-size: 12px; color: #039855;}
.payinout-week{background: #F6F7FF; border: 1px solid #D3D6F0; display: flex;}
.payinout-yesterday{ width:49.9%; padding:0.885vw 0 0 2.29vw;}
.payinout-yesterday h4{ margin:0; font-weight: 600; font-size:clamp(12px,0.729vw,14px); color: #1E203D; margin:0 0 6px 0;}
.payinout-yesterday h3{ margin:0; font-weight: 500; font-size: clamp(16px,1.30vw,25px); color: #2C3189; text-transform: uppercase; margin:0 0 13px 0;}
.payinout-yesterday .payinout-success p{ background:url(../../images/success-icon.png) no-repeat left 1px; background-size:14px 14px; padding:0 0 0 20px; font-weight: 600; font-size: 12px; color: #1E203D;}
.payinout-yesterday .payinout-success p span{ font-weight: 600; font-size: 12px; color: #039855;}
.payinout-today{ width:50.1%; border-left:1px solid #d3d6f0; text-align: right; padding:0.885vw 2.1875vw 0 0;}
.payinout-today h4{ margin: 0 0 5px 0; font-weight: 600; font-size:clamp(12px,0.729vw,14px); color: #1E203D;}
.payinout-today h3{ margin:0 0 11px 0; font-weight: 500; font-size: clamp(16px,1.30vw,25px); color: #039855; text-transform: uppercase;}
.payinout-today h3 span.positive{ background: #FFFFFF; border-radius: 50px; font-weight: 600; font-size:clamp(12px,0.729vw,14px); color: #039855; margin-right: 0.989vw; padding:4px 12px; display: inline-block;}
.payinout-today h3 span.negative{ background: #FFFFFF; border-radius: 50px; font-weight: 600; font-size:clamp(12px,0.729vw,14px); color: #C11A1A; margin-right: 0.989vw; padding:4px 12px; display: inline-block;}
.payinout-today p{ background:url(../../images/success-icon.png) no-repeat left 1px; background-size:14px 14px; padding:0 0 0 20px; font-weight: 600; font-size: 12px; color: #1E203D; display: inline-block;}
.payinout-today p span{ font-weight: 600; font-size: 12px; color: #039855;}
    /* CSS to style the chart container */
    .chart-container {
      width: 80%;  /* Adjust width of the chart */
      max-height: 300px;
      margin: 0 auto;
  }
  canvas {
    width: 100% !important;  /* Make canvas take 100% width */
    height: 100% !important;  /* Make canvas take 100% height */
}
/* Custom CSS */
.payinout-box .dropdown-toggle::after {
  display: none; /* Remove the default dropdown arrow */
}

.payinout-box .dropdown-toggle {
  background: none; /* Remove background */
  border: none; /* Remove border */
  padding: 0; /* Remove padding */
  font-size: 24px; /* Adjust font size for the three dots */
}

.payinout-box .dropdown-menu {
  background-color: #ffffff;
}

/* Optional: Styling for dropdown items */
.payinout-box .dropdown-item {
  font-size: clamp(10px,0.729vw,14px);
  padding: 10px 15px;
}
.payinout-box .header .dropdown{ margin-left: auto;}
#mapView,#payoutmapView{ display: none; background: #F6F7FF; border: 1px solid #D3D6F0; padding:10px;}
#mapView .chart-container,#payoutmapView .chart-container{ width:71%; margin:0 auto;}
/*  */
@media screen and (max-width: 1800px) {
 
}
@media screen and (max-width: 1700px) {
  .volume-boxes-wrapper .admin-card2-box p.admin-card2-success{ background-position: left 2px;}
  .volume-boxes-wrapper .admin-card2-box{ width:24%; margin-right: 1%;}
}

@media screen and (max-width: 1600px) {
  .comission-content-left{ width:65%;}
  .comission-content-right{ width:35%;}
}

@media screen and (max-width: 1500px) {
 
}
@media screen and (max-width: 1300px) {
  .volume-boxes-wrapper .admin-card2-box{ width:32.3%; margin-right: 1%;}
  .commission-content{ flex-direction: column;}
  .comission-content-left{ width:100%;}
  .comission-content-right{ width:100%; padding:20px;}
  .payinout-wrapper{ flex-direction: column;}
  .payinout-box{ width:100%; margin-bottom: 30px;}
  .payinout-box:last-child{ margin-bottom: 0;}
  .chart-container{ max-height: inherit;}
  .comission-content-right .chart-container{ max-height: 200px !important;}
}
@media screen and (max-width: 991px) {
  
  .volume-boxes-wrapper{ padding:20px;}
  .volume-box .header,.merchant-box .header{ padding:10px 0 10px 20px;}
  .volume-boxes-wrapper .volume-title{ padding:10px 20px;}
  .volume-boxes-wrapper .admin-card2-box h3,.volume-boxes-wrapper .admin-card2-box h4{ font-size: 14px;}
  .volume-boxes-wrapper .admin-card2-box .volume-success{ padding:10px 0 10px 20px;}
  .volume-boxes-wrapper .admin-card2-box p.admin-card2-success{font-size: 12px; padding-left:12px; background-position: left 4px;}
  .volume-boxes-wrapper .admin-card2-box p span{ font-size: 12px;}
  .dashboard-merchant{ flex-direction: column;}
  .dashboard-merchant .merchant-box{ width:100%}
  .dashboard-merchant .merchant-box:nth-child(1){ margin-bottom: 30px;}
  .merchant-box .orders-table td:nth-child(2) p,.merchant-box .orders-table td:nth-child(2) span,.merchant-box .orders-table td:nth-child(3),.merchant-box .orders-table td:nth-child(4) p,.merchant-box .orders-table td:nth-child(1){ font-size: 12px;}
}
@media screen and (max-width: 800px) {
  .volume-boxes-wrapper{ justify-content: space-between;}
  .volume-boxes-wrapper .admin-card2-box{ width:49%; margin-right: 0%;}
}
@media screen and (max-width: 600px) {
  .volume-boxes-wrapper .admin-card2-box{ width:100%;}
  .volume-boxes-wrapper .admin-card2-box:last-child{margin-bottom: 0;}
  .dashboard-statistics{ flex-direction: column;}
  .kyc-approved{ width:100%; margin-bottom: 30px;}
  .kyc-approved:last-child{ margin-bottom: 0;}
  .kyc-approved .header{ padding-left:20px;}
  .payinout-yesterday h3,.payinout-today h3{ font-size: 16px; flex-direction: row-reverse; justify-content: flex-end; display: flex; align-items: center; }
  .payinout-yesterday h3 span,.payinout-today h3 span{ margin: 0 0 0 10px;}
  .payinout-monthly{ flex-direction: column;}
  .payinout-monthly-box{ width:100%; margin-bottom: 10px;}
  .payinout-monthly-box:last-child{ margin-bottom: 0;}
  .payinout-monthly-box-success p{ margin-bottom: 0;}
  .payinout-monthly-box-success,.payinout-monthly-box-title{ padding:10px 0 10px 20px;}
  .payinout-week{ flex-direction: column;}
  .payinout-yesterday{ width:100%; padding:10px 0 10px 20px; border-bottom: 1px solid #d3d6f0;}
  .payinout-today{ width:100%; padding:10px 0 10px 20px; border-right: none; text-align: left;}
  .payinout-yesterday .payinout-success p,.payinout-today p{ padding-bottom:0; margin-bottom:0;}
  .payinout-yesterday h4{ font-size: 14px;}
  .payinout-box .header,.commissions-earned .header{ padding:10px 20px;}
  .comission-content-left table th:first-child,.comission-content-left table td:first-child{ padding:10px;}
  .comission-content-left{ overflow: auto;}
  .comission-content-left table{ min-width: 550px;}
  .comission-content-right{ padding:0}
  
}

body{
  background-color:#F8F8FF;
}
.app-sidebar .main-sidebar-header .header-logo .desktop-logo , .app-sidebar .main-sidebar-header .header-logo .desktop-dark{
  /*height:5rem;*/
  Width:229px;
  height:34px;
  top:48px;
  left:46px
}

.app-sidebar .main-sidebar-header .header-logo .toggle-logo{
  height:3rem;
}
.app-sidebar .main-sidebar-header .header-logo .toggle-dark{
  height:3rem;
}

 .tab-style-3 .nav-item .nav-link.test:after {
  content: "4";
}
.tab-style-3 .nav-item .nav-link.testing:after {
  content: "5";
}

.main-sidebar{
  margin-block-start:5.72rem;
}

.app-sidebar .main-sidebar-header {
  height: 5.75rem;
  background:#2c3189 !important;
}
.app-sidebar{
  background:#2c3189 !important;
  

}

.app-sidebar .side-menu__icon{
  color:#ADB2FF;
}

.app-sidebar .side-menu__item.active .side-menu__icon, .app-sidebar .side-menu__item:hover .side-menu__icon{
  color:#E9CA00 !important;
}

.btn-primary{
  background-color:#6B73FD  !important;
  border-color:#fff !important;
}

/*.col-auto .form-control{
  border-color: #ECABD4;
  color: #E96FAB;
  background-color: #FFFFFF;
}*/


/*.card.custom-card .card-header .card-title {
    color:#92064C;
}*/
.modal-content .title-header-background{
  background-color:#3F45A9 !important;
}

.btn-primary:hover{
  background-color:#3F45A9 !important;
  border-color:#3F45A9 !important;
}

.btn.btn-primary-light{
background-color:#6B73FD !important;
color:#ffffff !important;
}

.btn.btn-primary-light:hover{
background-color:#3F45A9 !important;
color:#ffffff !important;
border-color:#3F45A9 !important;
}

.table thead.table-primary th{
  color:#FFFFFF !important;
  background: #3F45A9 !important;
}
.btn.btn-success-light{
  background: #6B73FD !important;
  color:#ffffff !important;
}

.btn.btn-success-light:active, .btn.btn-success-light:focus, .btn.btn-success-light:hover{
background: #3F45A9 !important;
border-color: #3F45A9 !important;
color:#ffffff !important;
}

.btn.btn-warning-light{
  background: #FFEEF9 !important;
  color:#D8008B !important;
}

.btn.btn-warning-light:active, .btn.btn-warning-light:focus, .btn.btn-warning-light:hover{
background: #D8008B !important;
border-color: #D8008B !important;
  color:#FFEEF9 !important;
}

.btn-info-transparent{
background: #6B73FD !important;
color:#ffffff !important;
}

.btn-info-transparent:focus:hover, .btn-info-transparent:hover{
background: #3F45A9 !important;
border-color: #3F45A9 !important;
color:#ffffff !important;
}
.page-link{
color:#5C387D !important;
}

.pagination-style-1 .pagination .page-item.active .page-link{
  color:#FFF !important;
  background-color: #3F45A9 !important;
}

.payout-icon-background{
background-color: #FFFFFF;
width:1.5rem !important;
height:1.5rem !important;
color:#1B75BC;
}
.payin-icon-background{
  background-color: #FFFFFF;
  width:1.5rem !important;
height:1.5rem !important;
color: #92064C;

}
.payout-balance{
  background-color: #DE7CBC;
}
.payout-success-ratio{
  background-color: #D8008B;
}
.payin-success-ratio{
  background-color: #8A53BE;
}
.payin-balance{
  background-color: #C688FF;
}

.title-header-background{
  background-color:#3F45A9 !important;
  }

.title-header-background h5{
  color:#f3f3f3 !important;
}

.model-content{
    background-color: #FAF4FF !important;
}

tr:nth-child(even) {
    background-color: #f2f2f2 !important;

}

/* Apply background color to odd rows */
tr:nth-child(odd) {
    background-color: #ffffff !important;\

}

.card.custom-card .top-payin-header{
  background-color: #92064C !important;
  color: #FFFFFF;


}


/*.row .card.custom-card1 .top-payin-header{
  background-color:#FFFFFF !important;
  color: #92064C;
  border-bottom: none; 
  background-color: transparent;*/
  
  
}

.card.custom-card {
    width:20rem !important;
    display: flex;
    gap: 20px; 
    height: 100px; 
  
    
}





.card.custom-card .top-payin-header .card-title:before
{
background: linear-gradient(#FFFFFF 50%,#D7BFED 50%);
}

.card.custom-card .top-payout-header .card-title:before
{
background: linear-gradient(#FFFFFF 50%,#F2A5D6 50%);
}


.card.custom-card .top-payout-header{
  background-color: #1B75BC !important;
  color: #FFFFFF;
  
}



.bg-payin-image{
background-color: #F1E2FF !important;
  color: #6B3F94;
}

.bg-payout-image{
  background-color: #FFE7F6 !important;
  color: #DD43A6;
}

.payin-text-muted{
color:#E96FAB;
}

.payin-text{
color:#000000;
}

.payout-text{
color:#000000;
}

.payout-text-muted{
color:#1498CD;
}

.payin-border-bottom{
  border-bottom: 1px solid #FFF3F9 !important;

}

.payout-border-bottom{
  border-bottom: 1px solid #F1FBFF !important;
}

.payin-muted-header{
  background-color: #E4D2F4;
  color: #663B8D;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.payout-muted-header{
  background-color: #FFC9EC;
  color: #AB287C;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}

.common-card-title{
    position: relative;
    margin-block-end: 0;
    font-size: .9375rem;
    font-weight: 700;
    text-transform: capitalize;
    margin-bottom: var(--bs-card-title-spacer-y);
    color: var(--bs-card-title-color);
}

.card.custom-card .payin-commission-header{
  background-color: #92064C !important;
  color: #FFFFFF;
}

.card.custom-card .payout-commission-header{
  background-color: #1B75BC !important;
  color: #FFFFFF;
}


.payin-dashboard-background{
    background-image: url('../images/Oval-1.png');
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 235px;
    fill:red;
}



.payout-dashboard-background{
    background-image: url('../images/Oval.png');
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 235px;
}

.pagination-style-1{
  float:right;
}

.app-sidebar .side-menu__label {
  color:#ADB2FF;
}



.app-sidebar .slide-menu.child1 .side-menu__item, .app-sidebar .slide-menu.child2 .side-menu__item{
    color:#ADB2FF;
}

.slide.has-sub .slide-menu {
    color:#92064C;

}


.app-sidebar .side-menu__item:hover {
  color:#92064C;
}



[data-menu-styles=dark] .app-sidebar .side-menu__item.active, [data-menu-styles=dark] .app-sidebar .side-menu__item:hover {
    color: #ADB2FF;

}

/*.app-sidebar .side-menu__item.active .side-menu__label{
  color:#FFFFFF;
}*/
 
.side-menu__item.active {
        background-color:rgba(255,255,255,.05) !important;
        color: #FFFFFF !important;
      }


.app-sidebar .side-menu__item.active .side-menu__angle, [data-menu-styles=dark] .app-sidebar .side-menu__item.active .side-menu__icon, [data-menu-styles=dark] .app-sidebar .side-menu__item.active .side-menu__label, [data-menu-styles=dark] .app-sidebar .side-menu__item:hover .side-menu__angle, [data-menu-styles=dark] .app-sidebar .side-menu__item:hover .side-menu__icon, [data-menu-styles=dark] .app-sidebar .side-menu__item:hover .side-menu__label {
    color: #FFFFFF;     }

[data-menu-styles=dark] .app-sidebar .slide-menu.child1 .side-menu__item:hover {
    color: #ADB2FF;
}


/*.card-title {
  color:#92064C;
}*/

.breadcrumb .breadcrumb-item.active{
  color:#3F45A9
}


.page-header-breadcrumb{
   color:#E96FAB;
}

.login-body .btn-primary:hover,.login-body .btn-primary:focus,.login-body .signin-button{
    background-color: #5665F1 !important;
    color: #FAF4FF !important;
    border-color: #5665F1 !important;
}
.ri-user-line,.ri-lock-line,.ri-eye-off-line,.ri-eye-line{
    color:#5665F1;
}
.login-body{
   background-image:url('{{url_for("static",filename="assets/images/apex_login_logo.jpg")}}'); 
   background-repeat:no-repeat;
   background-size: cover;
}
.login-body .card.custom-card{
box-shadow: #5665F1 0px 7px 29px 0px;
}
.login-body .card.custom-card{
border-radius: 2rem !important;
}