/********* login css start ***********/

body {
  font-family: "Inter", sans-serif !important;
}

.auth-full-page-content.p-md-5.p-4 {
  margin: 0 auto;
}

.section-login {
  background: url(../../build/images/login-bg.svg);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 100%;
}

.section-login .auth-full-page-content {
  background-color: #fff;
  width: 100% !important;
  ;
  max-width: 408px;
  border-radius: 15px;
  border: 2px solid #E7E7E7;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.section-login h5.text-primary {
  font-size: 20px;
  font-weight: 700;
  line-height: 20px;
  text-align: center;
  color: #000000 !important;
}

.mb-4.mb-md-5.Log-in {
  margin-bottom: 30px !important;
}

.section-login label.form-label {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  text-align: left;
}

.section-login .form-control {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  color: #757575 !important;
  border-radius: 4px;
}

.mb-3.input-box.position-relative:after {
  content: "";
  position: absolute;
  right: 10px;
  top: 42px;
  font-weight: bold;
  background: url(../../../build/images/at-sign.svg);
  width: 15px;
  height: 17px;
  /* z-index: 999; */
  background-repeat: no-repeat;
}

.section-login button#password-addon,.section-login .password_adon {
  background-color: transparent;
  padding: 0;
  font-size: 12px;
  right: 8px;
  top: 9px;
  border: 0px;
  position: absolute;
}

.section-login input#userpassword {
  border-radius: 4px;
}

.section-login button#password-addon ,.section-login .password_adon {
  background-color: #e8f0fe;
}

.section-login button.btn.btn-primary.waves-effect.waves-light {
  background-color: #3A0CA3;
  align-items: center;
  display: flex;
  justify-content: center;
  gap: 4px;
  margin-top: 11px;
  border-color: #3a0ca3;
  transition: all 1s ease-out;

}

.section-login button.btn.btn-primary.waves-effect.waves-light:hover {
  background-color: #f52485;
  border-color: #f52485;
}

.mdi-eye-outline:before {
  content: "󰛐";
  font-size: 12px;
  color: #757575;
}

.section-login .button-section {
  font-weight: 500;
  font-size: 13px;
  line-height: 20px;
  text-align: center;
  color: #5E47D2 !important;
  background: #f7f5ff;
  border: 0px;
  width: 140px;
  height: 36px;
  padding: 8px 16px 8px 16px;
  border-radius: 4px;
  margin-top: 26px;
}

.Reset-button {
  display: flex;
  justify-content: center;
}

.section-login .button-section:hover {
  background: #e6e1fb;
  transition: all 2s ease;
}

.section-login {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.fa-eye:before {
  content: "\f06e";
  color: #757575;
}

.section-login button#password-addon,.section-login .password_adon  {
  background-color: transparent;
  padding: 0;
  height: auto;
  border: 0;
  position: absolute;
  right: 7px;
  top: 8px;
  font-size: 14px;
  z-index: 10;
}
.section-login .password_adon:focus,.section-login button#password-addon:focus {
  box-shadow: none;
}

.section-login input#userpassword {
  border-radius: 4px;
}

@media (min-width: 1200px) {
  .auth-full-page-content {
    min-height: auto;
  }
}

@media(max-width:1200px) {
  .section-login {
    display: block;
    padding-top: 50px;
    padding-bottom: 50px;
    height: 100vh !important;
  }
}
@media(max-width:767px) {
  .section-login {
    display: block;
    padding-top: 50px;
    padding-bottom: 50px;
    height: auto !important;
  }
}


/********* login css end ***********/

/********* dashboard css start ***********/
body[data-sidebar=dark] .navbar-brand-box {
  background: #ffffff;
}

.simplebar-content-wrapper {
  background-color: #ffffff !important;
}

body[data-sidebar=dark] .mm-active .active,
body[data-sidebar=dark] .mm-active .active i {
  color: #3A0CA3 !important;
}

#sidebar-menu ul li a {
  font-size: 16px;
  font-weight: 600;
}

.bx-home-circle:before {
  display: none;
}

div#sidebar-menu ul.side-menu.new_sideBar li a i {
  display: none;
}

div#sidebar-menu {
  padding: 32px;
}

div#sidebar-menu ul.side-menu.new_sideBar li a {
  padding: 0;
  margin-bottom: 20px;
}

header#page-topbar .navbar-header .navbar-brand-box a.logo.logo-light {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-left: 26px;
}






/********* dashboard css end ***********/

/* loader */
#loader_box {
  position: absolute;
  z-index: 99999999999999;
  background: #00000047;
  width: 100%;
  height: 100%;
  display: none;
}

#loader_box .loader {
  width: 48px;
  height: 48px;
  border: 5px solid #FFF;
  border-bottom-color: #1967D2;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
  position: relative;
  top: 50%;
  left: 50%;
}

body[data-sidebar="dark"] .vertical-menu {
  background: #ffF;
}

/* from here new design for the website is started */

#page-topbar .navbar-header {
  height: 90px !important;
}

#page-topbar .navbar-header .navbar-brand-box {
  padding-top: 46px;
  border-right: 1px solid #0000002e;

}

#page-topbar .navbar-header .d-flex {
  align-items: center;
}

#page-topbar .navbar-header .navbar-brand-box .logo.logo-light {
  padding-left: 7px !important;
}

div#sidebar-menu .side-menu.new_sideBar {
  padding-top: 30px;
}

div#sidebar-menu .side-menu.new_sideBar li a {
  color: #4F4F4F !important;
  font-size: 16px;
  line-height: 20px;
  font-weight: 400;
  display: flex;
  gap: 8px;
  align-items: center;

}

div#sidebar-menu .side-menu.new_sideBar li.mm-active .active {
  color: #3B0DA4 !important;
}

div#sidebar-menu .side-menu.new_sideBar li.mm-active .active svg path {
  stroke: #3B0DA4 !important;
}

.sidebar-enable.vertical-collpsed .navbar-brand-box {
  padding-top: 0 !important;
}

.sidebar-enable.vertical-collpsed #sidebar-menu {
  padding-right: 0 !important;
  padding-left: 20px !important;
}

.sidebar-enable.vertical-collpsed #sidebar-menu li:hover>a {
  background: #fefefe !important;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  border-radius: 5px !important;
  padding-left: 18px !important;
  transition: all .5s ease !important;
}

.page-content {
  padding: 120px 18px 60px;
}

.page-title-box h4 {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #8F8F8F;
  text-transform: capitalize;
}

.page-title-box {
  padding-bottom: 15px;
}

.page_filter {
  margin-bottom: 20px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}

.page_filter label {
  font-size: 16px;
  color: #4F4F4F;
  font-weight: 400;
  width: 80px;
}

.page_filter .form-select {
  width: 100%;
  max-width: 220px;
  border-radius: 8px;
  padding: 8px 10px;
}

select:focus {
  box-shadow: 0 0 0 .15rem #D9ECFF !important;
}

.page_filter .form-select {
  width: 100%;
  max-width: 220px;
  border-radius: 8px;
  padding: 8px 10px;
  color: #293050;
  font-size: 15px;
  line-height: 20px;
  font-weight: 600;
}

.col_rows .card.mini-stats-wid {
  background: #3A0CA3;
  border-radius: 15px;
  height: 100%;
  margin-bottom: 11px;
  transition: all 1s ease;
  border: 1px solid transparent;
}

.col_rows .coustom_cards{
  margin: 10px 0;
}

.col_rows .card-body p,
.col_rows  .card-body h4 {
  color: #fff !important;
}

.col_rows .card.mini-stats-wid .card-body .icon_svg_box path {
  stroke: #fff !important;
}

.col_rows .card.mini-stats-wid:hover .flex-grow-1 h4,
.col_rows .card.mini-stats-wid:hover .flex-grow-1 .text-muted,
.col_rows .card.mini-stats-wid:hover .card-body .icon_svg_box path {
  color: #3A0CA3 !important;
  stroke: #3A0CA3 !important;
}

.col_rows .card.mini-stats-wid:hover {
  border: 1px solid #3A0CA3;
  background: #fff !important;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.col_rows .card.mini-stats-wid .card-body a {
  display: block;
  height: 100%;
}

.col_rows .card.mini-stats-wid .card-body .d-flex {
  gap: 15px;
  height: 100%;
  align-items: center;
}

.col_rows .card.mini-stats-wid .card-body .icon_svg_box {}

.col_rows .card.mini-stats-wid .card-body .flex-grow-1 h4 {
  font-size: 32px;
  line-height: 20px;
  font-weight: 700;

}

.col_rows .card.mini-stats-wid .card-body .flex-grow-1 .text-muted {
  font-size: 11px;
  line-height: 20px;
  font-weight: 400 !important;
  margin-bottom: 8px;
}

.col_rows .card.mini-stats-wid .card-body .flex-grow-1 h4 span {
  font-size: 11px;
  line-height: 20px;
  font-weight: 400 !important;
}

.bottom_row_chrats .outer_box_pad .inner_box_pad {
  height: 100%;
  background: #fff;
  padding: 25px 20px;
  border-radius: 20px;
  border: 1px solid #00000038;

}

.bottom_row_chrats .form-select {
  width: auto !important;
  border: 0;
  font-weight: 600;
  font-size: 12px;
  color: #0F2552;
  padding-right: 28px;
}

.bottom_row_chrats .pad_iber_filter h6 {
  font-size: 14px;
  color: #4D4D4D;
  margin-bottom: 0;
  line-height: 18px;
}

.bottom_row_chrats .pad_iber_filter {
  padding-bottom: 4px;
  border-bottom: 1px solid #00000030;
  margin-bottom: 10px;
}

/* .bottom_row_chrats .outer_box_pad .inner_box_pad #hourlyUsageChart {
    height: 100% !important;
    width: 100% !important;
  } */

.bottom_row_chrats .outer_box_pad .inner_box_pad .user_demographic {
  font-size: 14px;
  line-height: 17px;
  color: #4D4D4D;
  font-weight: 500 !important;
  margin-bottom: 8px;
}

.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box h4 {
  font-size: 14px;
  line-height: 17px;
  font-weight: 500;
  color: #4D4D4D;
  margin-bottom: 5px;
}

.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul {
  padding: 0;
}
.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul .person_list {
  list-style: none;
  display: grid;
  grid-template-columns: 46px 1fr;
  gap: 10px;
  padding: 10px 0;
  position: relative;
}
.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul .person_list img {
  height: 46px;
  width: 46px;
  border-radius: 100px;
  object-fit: cover;
}

.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul .person_list .person_data {
  font-size: 12px;
  font-weight: 400;
  color: #000;
}
.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul .person_list .person_data strong{
  font-weight: 800;
}

.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul .person_list::after {
  content: '';
  height: 1px;
  background: #00000040;
  position: absolute;
  bottom: 0;
  left: -20px;
  right: -20px;
}
.bottom_row_chrats .outer_box_pad .inner_box_pad .sub_box ul .person_list:last-child::after{
  display: none;
}

body{
  background-color: #fff ;
}
.footer{
  background: #fff ;
}

.simplebar-content-wrapper{

  border-right: 1px solid #0000002e;
}
.navbar-header{
  border-bottom: 1px solid #0000002e;

}
#page-topbar{
  box-shadow: none;
}
.bottom_row_chrats {
  margin-top: 25px !important;
}
.outer_box_pad {
  margin-bottom: 28px;
}
.scroll_box{
  max-height: 350px;
  overflow: scroll;
}
.simplebar-content {
  height: 100% !important;
}
div#sidebar-menu {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between !important;
}

.header-profile-user {
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  margin-left: 14px;
}

/* .tab_tables {
  padding: 16px;
  border: 1px solid #00000026;
  border-radius: 12px;
  margin-bottom: 40px;
} */

.tab_tables .nav.nav-pills li a {
  min-width: 100px;
  padding: 0 10px;
    padding-bottom: 0px;
  padding-bottom: 6px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  color: #475569 !important;
  display: inline-block;
  border-bottom: 2px solid transparent;

}
.tab_tables .nav.nav-pills {
  margin-bottom: 20px;
  border-bottom: 1px solid #00000021;
}
.tab_tables .nav.nav-pills li.active a {
  color: #0F172A !important;
  border-bottom: 2px solid #E1A532;
}
.tab_tables  .dataTables_wrapper {
  padding: 0 !important;
  border: 0px !important;
}
.table-striped > tbody > tr ,.table-striped > thead > tr {
  background-color: #fff;
}
.table-striped > tbody > tr:nth-of-type(2n) > * {
  background-color: #F6ECFF;
}
.tab_tables table tbody .underLine_td {
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
  color: #0F172A;
  text-decoration: underline;
}
.tab_tables table thead th {
  font-size: 12px;
  line-height: 20px;
  color: #000;
  font-weight: 600;
  background: #F6ECFF;
  padding-top: 17px;
  padding-bottom: 17px;
  min-width: 111px;
}


.tabel_Toggel_btn_box {
  margin-top: 12px;
  margin-bottom: 20px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 25px;
}
.tabel_Toggel_btn_box .togell_btn_main .form-switch {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}
.tabel_Toggel_btn_box .togell_btn_main .form-switch label {
  font-size: 16px;
  line-height: 20px;
  color: #4F4F4F;
}
.tabel_Toggel_btn_box .togell_btn_main .form-switch .form-check-input{
  height: 16px;
  width: 30px;
}
.tabel_Toggel_btn_box .togell_btn_main .form-switch .form-check-input:checked {

  background-color: #694DF9;
}
.add_user_table_btn {
  width: 190px;
  height: 33px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 7px;
  background: #972FFF;
  border: 1px solid transparent;
  border-radius: 6px;
  color: #FFF;
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  transition: all 1s ease ;
  display: none;
}
.add_user_table_btn:hover{
  border-color: #972FFF;
  color: #972FFF;
  background: #ffff;

}
.add_user_table_btn:hover svg path{
  stroke:#972FFF ;
}

table.dataTable > thead .sorting::before, table.dataTable > thead .sorting::after, table.dataTable > thead .sorting_asc::before, table.dataTable > thead .sorting_asc::after, table.dataTable > thead .sorting_desc::before, table.dataTable > thead .sorting_desc::after, table.dataTable > thead .sorting_asc_disabled::before, table.dataTable > thead .sorting_asc_disabled::after, table.dataTable > thead .sorting_desc_disabled::before, table.dataTable > thead .sorting_desc_disabled::after {
  position: absolute;
  bottom: 15px;
  display: block;
  opacity: .3;
}

.table tbody tr td:first-child div:first-child img {
  margin-right: 9px;
}
.table tbody tr td:first-child div:first-child {
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
  color: #000;
}
.table tbody tr td{
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  color: #000;
}
td .badge {
  padding: 4px 21px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 100px;
}
td .badge.bg-success {
  background-color: #972FFF !important;
}
td .badge.bg-danger {
  background-color: #D40000 !important;
}
.action-button .edit {
  background-color: #972FFF;
  border: 1px solid transparent;
  padding: 1px 10px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
  color: #fff;
  transition: all 1s ease;
}
.action-button .edit:hover{
  background-color: #fff;
  color: #972FFF;
border-color: #972FFF;
}
#DataTables_Table_0_paginate .pagination #DataTables_Table_0_previous a {
  border-radius: 10px 0 0 10px !important;
}
#DataTables_Table_0_paginate .pagination #DataTables_Table_0_next a {
  border-radius: 0px 10px 10px 0px !important;
}
#DataTables_Table_0_paginate .pagination .paginate_button.active .page-link {
  background-color: #3A0CA3;
}
#DataTables_Table_0_paginate  .paginate_button a {
  border: 2px solid #8F8F8F !important;
  color: #8F8F8F !important;
  background-color: #fff;
}



.user_name_page_up {
  color: #8F8F8F;
  font-size: 14px;
  line-height: 20px;
  margin: 9px 0;
  margin-bottom: 25px;
}
.Profile_proview_row .outer_box {
  background: #fff;
  padding: 25px 16px;
  border: 1px solid #aaaaaa4f;
  height: 100%;
  border-radius: 30px;
}




.Profile_proview_row .profile_image_box .image_box {
  padding: 12px;
  border: 1px solid #00000059;
  border-radius: 100%;
}
.Profile_proview_row .profile_image_box .image_box {
  padding: 12px;
  border: 1px solid #00000059;
  border-radius: 100%;
  height: 210px;
  width: 210px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.Profile_proview_row .profile_image_box .image_box img {
  height: 100%;
  width: 100%;
  border-radius: 100%;
  object-fit: cover;
  filter: drop-shadow(0 0 0.75rem #bbbbbb5e);
}
.percentage_bade {
  background-color: #3A0CA3;
  position: absolute;
  bottom: -9px;
  padding: 5px 17px;
  border-radius: 100px;
  color: #fff;
  font-size: 16px;
  line-height: 20px;
  font-weight: 700;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}


.userInfo_box .inner_info_box .username {
  font-size: 24px;
  line-height: 20px;
  font-weight: 700;
  color: #000;
  margin-bottom: 20px;
}
.userInfo_box .inner_info_box p {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  gap: 7px;
  margin-bottom: 8px;
  word-break: break-all;
}
.userInfo_box .inner_info_box p span {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -9px;
  font-size: 20px;
}
.userInfo_box .inner_info_box .btn_boxes {
  margin: 12px 0;
    gap: 20px;
    display: flex;
    margin-bottom: 15px;
}
.userInfo_box .inner_info_box .btn_boxes .basic_badge {
  padding: 4px 8px;
  font-size: 12px;
  line-height: 20px;
  border-radius: 100px;
  color: #fff;
}
.userInfo_box .inner_info_box .btn_boxes .basic_badge.verify-badge {
  background-color: #972FFF;
}
.userInfo_box .inner_info_box .btn_boxes .basic_badge.unverify-badge {
  background-color: #D40000;
}
.userInfo_box .inner_info_box .btn_boxes .female-badge.basic_badge {
  background-color: #FF2FDE;
}

.userInfo_box .unverify_btn {
  padding: 8px 24px;
  color: #fff;
  border: 0;
  background-color: #D40000;
  border-radius: 5px;
  gap: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.userInfo_box .verify_btn {
  padding: 8px 24px;
  color: #fff;
  border: 0;
  background-color: #972FFF;
  border-radius: 5px;
  gap: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.images_profile_box .user_pics_head {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #000;
}
.images_profile_box .medias_box {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 20px;
  flex-wrap: wrap;
  height: 256px;
  overflow: auto;
}
.images_profile_box .medias_box .person_pics {
  position: relative;
}
.images_profile_box .medias_box .person_pics .show_image {
  height: 72px;
  width: 52px;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
}
.images_profile_box .medias_box .person_pics .delete-icon {
  top: unset;
  bottom: -10px;
  left: 0;
  right: 0;
  margin: auto;
  height: 31px;
  width: 31px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
  background-color: #FF08AA;
  box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
  z-index: 2;
}


.profile_edit_form .update-form .heading_main h4 {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #000;
  margin-bottom: 0;
}
.profile_edit_form .update-form .heading_main button {
  font-size: 12px;
  height: 23px;
  width: 105px;
  background-color: #972FFF;
  line-height: 20px;
  padding: 0;
  font-weight: 500;
  border: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.profile_edit_form .update-form .heading_main {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 11px;
}
.update-form .form-group {
  border: 1px solid #BCBCBC;
  margin-bottom: 14px;
  border-radius: 15px;
  padding: 15px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.update-form .form-group label {
  margin-bottom: 0;
  font-size: 13px;
  color: #BCBCBC;
  font-weight: 400 !important;
  margin-top: -8px;
}
.update-form .form-group input {
  padding: 0;
  border: 0;
  font-size: 20px;
  line-height: 20px;
  font-weight: 600;
  color: #000;
}
 select:focus {
  box-shadow: 0 0 0 .15rem #972FFF33 !important;
}
.interest_box .interests .inside_interest_heading {
  padding-left: 14px;
  margin-bottom: 6px;
  font-size: 13px;
  color: #BCBCBC;
  font-weight: 400 !important;
}
.interest_box .interests .inteste_main_box {
  flex-direction: revert;
  flex-wrap: wrap;
  gap: 15px;
  border-color: #878787;
}

.interest_box .interests .intestes_cat, .interest_box .interests .intestes_gender {
  padding: 5px 10px;
  border: 1px solid #878787;
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  line-height: 20px;
  color: #000;
}

.chat_box_main .chat_heading {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #000;
  margin-bottom: 15px !important;
}
.chat_box_main .user_chat {
  padding: 10px 0;
  border-bottom: 1px solid #00000032;
  display: grid;
  grid-template-columns: 50px 1fr;
  gap: 10px;
}
.chat_box_main .user_chat:last-child{
  /* border-bottom: 0; */
}
.chat_box_main .user_chat .info_box_user .haeding_user {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.chat_box_main .user_chat img {
  height: 50px;
  width: 50px;
  border-radius: 100px;
  object-fit: cover;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}

.chat_box_main .user_chat .info_box_user .haeding_user h4 {
  font-size: 16px;
  line-height: 20px;
  font-weight: 700;
  color: #000;
}
.chat_box_main .user_chat .info_box_user .haeding_user h4 span {
  font-size: 13px;
  font-weight: 400;
}
.chat_box_main .user_chat .info_box_user .haeding_user .time {
  color: #525252;
  font-size: 11px;
  line-height: 20px;
  font-weight: 400;
}
.chat_box_main .user_chat .info_box_user p {
  font-size: 13px;
  line-height: 20px;
  color: #000;
  font-weight: 400;
}
/* sbscription page starts here */
.subscription_row {
  height: 100%;
  background: #fff;
  padding: 25px 20px;
  border-radius: 20px;
  border: 1px solid #00000038;
}

.subscription_row .subScription_heading {
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: #000;
}
.subscription_row .mini-stats-wid .inner_card_sub .tag_plan {
  font-size: 24px;
  line-height: 23px;
  font-weight: 700;
  margin-bottom: 21px;
}
.subscription_row .mini-stats-wid .inner_card_sub .price_box h6 {
  font-size: 16px;
  line-height: 20px;
  font-weight: 600;
  margin-bottom: 4px;
}
.subscription_row .mini-stats-wid .inner_card_sub .price_box p{
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  margin-bottom: 25px;
}
.subscription_row .mini-stats-wid .inner_card_sub .tag_plan ,.subscription_row .mini-stats-wid .inner_card_sub h6,.subscription_row .mini-stats-wid .inner_card_sub  p{
  color: #fff;
}
.subscription_row .edit_plan_btn {
  width: 100%;
  border: 1px solid transparent ;
  font-size: 14px;
  line-height: 20px;
  border-radius: 5px;
  background: #fff;
  color: #3A0CA3;
  font-weight: 600;
  padding: 6px 10px;
  transition: all 1s ease;
}
.subscription_row .card.mini-stats-wid:hover  .inner_card_sub .tag_plan , .subscription_row .card.mini-stats-wid:hover .inner_card_sub h6,.subscription_row .card.mini-stats-wid:hover .inner_card_sub  p{
color: #3A0CA3 !important;
}
.subscription_row .card.mini-stats-wid:hover  .edit_plan_btn{
  background: #3A0CA3;
  color: #fff;
  border-color: #3A0CA3 ;
}

.subscription_row  .add_new_plane {
  background: #D9D9D9;
  border-radius: 15px;
  height: 100%;
  margin-bottom: 11px;
  transition: all 1s ease;
  border: 1px solid transparent;
  padding: 16px;
  cursor: pointer;
}
.subscription_row .add_new_plane:hover{
  background: #B5B5B5;
}
.subscription_row .add_new_plane .card-body {
  display: flex;
  justify-content: center;
  align-items: center;
}
.subscription_row .add_new_plane .icon_box_plus {
  height: 60px;
  width: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #000;
  border-radius: 100px;
}
.subscription_row .add_new_plane .icon_box_plus i {
  font-size: 31px;
  color: #000;
}
.subscription_row .add_new_plane .add_plan-text {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.subscription_row .add_new_plane .add_plan-text p {
  margin-bottom: 0;
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
  color: #111 !important;
}
/* sbscription page starts here */
.reset_login_div{
  padding: 20px !important;
}

/* chat style starts from here */
.main_chat_box .card {
  border: 1px solid #EFF0F6;
  box-shadow: none !important;
  border-radius: 15px;
  padding: 16px;
}
.main_chat_box .card .msg_card_body{
  padding: 0;
}



.main_chat_box .card .msg_head {
  background-color: transparent;
  padding: 0;
    padding-bottom: 0px;
  padding-bottom: 13px;
  border-bottom: 1px solid #00000026;
}
.main_chat_box  .msg_head_boc {
  justify-content: space-between;
  align-items: center;
}
.main_chat_box .card .msg_head .user_info_box {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}
.main_chat_box .card .msg_head .user_info_box .img_cont .user_img {
  width: 40px;
  height: 40px;
  border-radius: 100px;
  object-fit: cover;
}
.main_chat_box .card .msg_head .user_info_box span {
  font-size: 20px;
  font-weight: 700;
  color: #3A0CA3;
}
.main_chat_box .card .msg_head .user_info_box span.age {
  font-size: 16px;
  font-weight: 400;
}
.main_chat_box .card .msg_head .btn_side ,.chat_list .btn_side {
  background: #ECECEC;
  border: 0;
  padding: 5px 16px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: #972FFF;
  border-radius: 6px;
}
.chat_list .btn_side{
  width: 100%;
}
.chat_list .card-body.contacts_body {
  padding: 0;
}
.chat_list .card-body.contacts_body .contacts {
  padding: 0;
  margin-top: 11px;
  overflow: auto;
}
.chat_list .card-body.contacts_body .contacts .user_name , .chat_list .card-body.contacts_body .contacts .user_data_main .user_name {
    display: flex;
    /*! border-bottom: 1px solid #00000026; */
    gap: 10px;
}
.chat_list .card-body.contacts_body .contacts .user_name:last-child, .chat_list .card-body.contacts_body .contacts  .user_data_main  .user_name:last-child{

  border-bottom: 0px ;

}
.chat_list .card-body.contacts_body .contacts .user_name li, .chat_list .card-body.contacts_body .contacts li  {
  list-style: none;
  padding: 15px 0;
  border-bottom: 1px solid #00000026;

}

.chat_list .card-body.contacts_body .contacts .user_name li:last-child, .chat_list .card-body.contacts_body .contacts li:last-child{
    /* border-bottom: 0; */
}
.chat_list .card-body.contacts_body .contacts .user_name li.active, .chat_list .card-body.contacts_body .contacts li.active  {
background-color: #EFF0F6;

}
.chat_list .card-body.contacts_body .contacts .user_name li .user_data_main, .chat_list .card-body.contacts_body .contacts .user_data_main  {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
.chat_list .card-body.contacts_body .contacts .user_name li .user_data_main .img_cont img, .chat_list .card-body.contacts_body .contacts .user_data_main  .user_name .img_cont img {
  height: 50px;
  width: 50px;
  object-fit: cover;
}
.chat_list .user_data_main .user_text_data {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
}
.chat_list .user_data_main .user_text_data .chat_list_user_heading {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
}
.chat_list .user_data_main .user_text_data .chat_list_user_heading span {
  font-size: 14px;
  line-height: 20px;
  font-weight: 700;
  color: #000;

}
.chat_list .user_data_main .user_text_data .chat_list_user_heading .time {
  font-size: 11px;
  color: #525252;
  font-weight: 400;
}
.chat_list .user_data_main .user_text_data .chat_list_user_heading {
  display: flex;
  justify-content: space-between;
  width: 100%;
  align-items: center;
  margin-bottom: 3px;
}
.chat_list .user_data_main .archived_btn_box {
  background-color: #CCC;
  border-radius: 10px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  line-height: 11px;
  color: #3A0CA3;
  text-align: center;
  gap: 6px;
  cursor: pointer;
}
.chat_list .user_data_main .archived_btn_box:hover{
  background-color: #B3B3B3;
}


.main_chat_box  .msg_card_body {
  height: calc(100% - 80px);
  overflow: auto;
}
.main_chat_box  .message_main_box{
  height: 100%;
  padding-left: 10px;
  padding-right: 10px;
}

.main_chat_box  .card-footer {
  padding: 0;
}
.main_chat_box  .card-footer form#chat-form {
  margin-bottom: 0 !important;
}
.main_chat_box .card-footer .input-group {
  border: 2px solid #3A0CA3;
  padding: 6px 10px;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  align-items: center;
  gap: 10px;
}
.main_chat_box .card-footer .input-group .input-group-append label {
  height: 35px;
  width: 35px;
  border-radius: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #23152C;
  color: #fff;
  font-size: 18px;
  margin-bottom: 0;
  cursor: pointer;
  transition: all .5s ease;
}
.main_chat_box .card-footer .input-group .input-group-append label:hover{
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
.main_chat_box .card-footer #chat-form .input-group .type_msg {
  resize: none;
  padding: 0;
  min-height: 23px !important;
  font-size: 16px;
  line-height: 20px;
  font-weight: 400;
  border: 0;
  background-color: transparent;
}


.justify-content-end.message .img_cont_msg,.justify-content-start.message .img_cont_msg {
  display: none;
}

.msg_cotainer_send, .msg_cotainer {
  padding: 10px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  max-width: 300px;
  border-radius: 20px;
  padding-bottom: 30px;
  position: relative;
  width: auto;
  min-width: 105px;
}

.justify-content-end.message .msg_cotainer_send {
  background-color: #3A0CA3;
  color: #fff;
  border-top-right-radius: 0 !important;
}
.msg_cotainer_send .msg_time_send, .msg_cotainer .msg_time_send {
  font-size: 10px;
  line-height: 5px;
  font-weight: 400;
  color: #fff;
}
.justify-content-end.message .msg_cotainer_send .msg_time_send {
  position: absolute;
  bottom: 16px;
  right: 14px;
}
.justify-content-start.message .msg_cotainer {
  background-color: #E3E3E3;
  border-top-left-radius: 0;
  color: #222;

}
.justify-content-start.message .msg_cotainer .msg_time {
  font-size: 10px;
  line-height: 5px;
  font-weight: 400;
  color: #222;
  position: absolute;
  right: 15px;
  bottom: 16px;
}
.main_chat_box .message_main_box #today-label {
  text-align: center;
  margin: 13px 0;
  color: #0009;
  font-size: 12px;
}
.main_chat_box .card {
  margin-bottom: 0;
}
.justify-content-end.message {
  gap: 11px;
  /* padding-right: 10px; */
}
.justify-content-end.message .dropdown.meassage_dropDown .btn{
  cursor: pointer;
  width: 25px;
  height: 27px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.justify-content-end.message .dropdown.meassage_dropDown .btn:focus {
  box-shadow: none !important;
  border: 1px solid #0000001c;
}
.userInfo_box .verify_btn .delete-data, .userInfo_box .unverify_btn .delete-data {
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}
.images_profile_box .medias_box .person_pics .delete.delete-data{
  display: inline-block;
  position: absolute;
  top: unset;
  bottom: -10px;
  left: 0;
  right: 0;
  /* box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px; */
  margin: 0;
}
.images_profile_box .medias_box .person_pics .delete.delete-data .delete-icon {
  /* box-shadow: none; */
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
  position: unset;
}

.chat_list .card {
  box-shadow: none !important;
}
.chat_list .user_data_main .user_text_data .bottom_line {
  margin-bottom: 0;
  font-size: 13px;
  line-height: 20px;
  font-weight: 400;
  color: #000;
}

.roles_table .btn-warning {
  background-color: #972FFF !important;
  padding: 7px 23px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 5px;
  border: 0;
}
.btn_box_roles {
  margin: 23px 0;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.btn_box_roles a {
  background-color: #972FFF !important;
  padding: 6px 23px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 5px;
  border: 0;
  margin: 0 !important;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 9px;
}
.roles_heading {
  font-size: 31px;
  margin-bottom: 23px;
  font-weight: 700;
}
.roles_table .admin_btn {
  background-color: #972fff !important;
}
.roles_table .support_btn {
  background-color: #1B59F8 !important;
}
.roles_table .subadmin_btn{
  background-color: #767676 !important;
}
.edit_role_main .accordion-button {
  background-color: #F6ECFF !important;
  border: 0 !important;
  color: #000000c4;
  font-size: 16px;
  font-weight: 600;
}
.edit_role_main input {
  accent-color: #972FFF !important;
}
.roles_heading.flex_heading .btn {
  border-radius: 98px;
  padding: 6px 20px;
}
.roles_table .btn.btn-danger {
  background-color: #D40000 !important;
  padding: 7px 23px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 5px;
  border: 0;
}
.roles_table .btn-success {
  padding: 7px 23px;
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 5px;
  border: 0;
  margin-left: 13px;
}
div#sidebar-menu .side-menu.new_sideBar li.mm-active .active {
  color: #3B0DA4 !important;
  font-weight: 600;
}
.roles_table .bts_edit_list {
  min-width: 500px;
}
/* ********************************************************** */

/* ********************************************************** */


/* chat style starts from here */

@media(max-width:1600px) {


  .bottom_row_chrats .outer_box_pad .inner_box_pad .pad_iber_filter h6 {
    font-size: 12px;
  }
}

@media(max-width:1250px) {
    .pad_iber_filter {

      flex-direction: column;
      align-items: flex-start !important;
      gap: 3px;
    }

}

@media(max-width:992px){
  #page-topbar .navbar-header .navbar-brand-box {
    padding-top: 20px;
    border-right: 0;
    /* border-bottom: 1px solid #0000002e; */
  }
  #page-topbar .navbar-header .navbar-brand-box .logo span.logo-sm{
    margin-top: -17px;
  }
}

@media(max-width:600px){
.tabel_Toggel_btn_box {
  flex-direction: column;
  align-items: flex-start;
}
}


.gm-ui-hover-effect{
    height: 10px !important;
    width: 30px !important;
}

.gm-ui-hover-effect span{
    width: 20px !important;
    height: 20px !important;
}

.gm-style-iw-chr{
    /* display: none; */
}


.gm-style-iw-d p{
    margin-bottom: 5px;
}


.file-icon-box .file-icon i{
    font-size: 50px;
    color: #fff;
}
.contacts .user_data_main {
    display: grid !important;
    grid-template-columns: 1fr 55px;
  }
  .archived_chat_list .user_data_main {
    display: flex !important;
  }

  .card-footer  .uploadImage .img {
    height: 60px;
    width: auto !important;
    border-radius: 8px;
    filter: brightness(77%);
  }
  .card-footer   .removeFile {
    height: 18px;
    width: 18px;
    background: #d7050585;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100px;
    position: absolute;
    z-index: 10;
    top: -6px;
    right: -7px;
  }
  .card-footer  .removeFile .fa-solid.fa-xmark {
    color: #fff !important;
    font-size: 12px;
  }
  .card-footer   .removeFile:hover {
    background: #e61717;
  }
  .msg_cotainer_send .file-icon-box .file-icon {
    display: inline-block !important;
  }
  .msg_cotainer_send .file-icon-box .file-icon .pdfFile {
    height: 100px;
    width: auto !important;
  }

.unset-flex{
    display: block !important;
}

.unreadChatMessageCount{
    background: #e61717;
    font-size: 10px;
    border-radius: 50%;
    padding: 4px;
}


.uploadDocFile ,.uploadImage,.uploadAudio,.uploadVideo{
    position: relative;
    display: inline-block;
  }

  .card-footer{
    background: transparent;
  }

  .audioFile {
    background: #3a0ca3;
    border-radius: 38px;
  }
  .videoFile {
    background: #cacaca;
    border-radius: 23px;
  }


  .noti_body {
    max-width: 350px;
    padding: 10px;

}

.noti_body .Not_heading {
    font-size: 20px;
    padding: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.178);
}

.newIncome {
    box-shadow: rgba(168, 168, 168, 0.2) 0px 7px 29px 0px;
    background: #f0f0f0;
    background-color: rgb(240, 240, 240);
    border-radius: 6px;
}

.check {
    display: flex;
    justify-content: flex-end;
    align-items: center
}

.noti_scroll {
    min-height: 213px;
    max-height: 213px;
    overflow-y: scroll;
    padding-bottom: 20px
}

.noti_scroll .item {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 8px;
    padding-bottom: 10px;
    border-bottom: 1px solid #0000001a;
    padding-bottom: 16px;
}

.noti_scroll .item:hover {
    background-color: #eee;
    border-radius: 6px;
}

.active .check i {
    color: green !important;
}

.noti_scroll .item_headi {
    font-size: 14px;
    color: #424242;
    font-weight: 500;
    margin-bottom: 0;
    line-height: 23px;
}

.noti_scroll .data {
    font-size: 12px;
    color: #393939d1;
    margin-bottom: 0
}

.noti_scroll .time {
    font-size: 12px;
    color: #393939d1;
    ;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 0
}

.noti_scroll .time_icon i {
    font-size: 13px;
    margin-right: 6px;
}

.noti_scroll .item_headi {
    font-size: 14px;
    color: #424242;
    font-weight: 500;
    margin-bottom: 0;
    line-height: 23px;
  }

  canvas {
    display: unset !important;
}

#canvas {
    width: 100%; /* Make the canvas responsive */
    height: auto; /* Set the height to auto */
    min-height: 300px; /* Optional: Set a minimum height */
}

audio {
    width: 100%;
}