body {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  background-color: #fff !important;
  font-family: Inter;
  overflow-x: hidden;
}

a {
  text-decoration: none !important;
}

.nav-container {
  background-color: #fff;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  height: 3.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 20px 0px 20px;
  position: sticky;
  z-index: 100; 
  top: 0;
}

.anychart-credits {
  display: none !important;
}

#funnelchart {
  width: 90%;
  height: 20rem;
}

.chart-container {
  height: 16rem;
  padding: 20px;
}

.chart-container div:nth-child(odd) {
  height: 120%;
}

.chart-container div:nth-child(even) {
  height: 120%;
}

.extra-option-container,
.extra-option-container div {
  margin-right: 20px;
}

.extra-option-container div button {
  box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, 0.4) !important;
}
.sidenav{
  width: 200px;
}
.sideBar-outer-container {
  position: relative;
}

.sideBar-container {
  position: absolute;
  right: 1%;
  width: 15rem;
  border-radius: 5px;
  background-color: rgb(233, 233, 233);
  box-shadow: 1px 1px 10px 1px rgb(206, 203, 203);
  z-index: 10;
}

.sideBar-container div {
  display: flex;
  align-items: center;
}

.sideBar-container div:hover {
  background: #f5f5f5;
}

.sideBar-container i {
  padding-left: 10px;
  font-size: 1.2rem;
  color: #7367f0;
}

.sideBar-container p {
  font-size: 1rem;
  padding: 5px 0px 0px 20px;
  color: #7367f0;
}

.left-fixed-nav {
  position: fixed;
  z-index: 10;
  height: 100%;
  background-color: #e2dfdf;
  min-width: 12%;
  border-right: 1px solid rgba(122, 118, 118, 0.555);
}

.left-username {
  background-color: #7367f0;
  height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #f5f5f5;
  font-size: 1.4rem;
}

.left-menu-container {
  position: relative;
  left: 50%;
  transform: translate(-40%, 0%);
}

.left-menu-container div {
  color: #7367f0;
  padding: 0.5rem 0rem 0rem 0rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  margin: 0 auto !important;
  width: 100%;
}

.left-menu-container div i {
  padding: 0px 10px 0px 0px;
  font-size: 1.2rem;
  font-weight: 800;
}

.left-menu-container div p {
  padding: 10px 0px 0px 10px;
  font-size: 1rem;
}


.drop-container div {
  position: relative;
  left: 50%;
  transform: translate(-30%, 0);
  margin-bottom: 20px !important;
}

.drop-container div a {
  color: #7367f0 !important;
}

.dropdown-menu {
  background-color: #fff !important;
}

.dropdown-menu span {
  color: #7367f0 !important;
  display: inline-block;
  font-size: 13px;
}
.dropdown-menu i{
  color:#7367f0
}

.left-nav-firstTwo {
  padding-left: 10px !important;
}
.center-console {
  margin-left: 200px;
  min-width: 85%;
  padding-left: 10px;
  padding-right: 20px;
  transition: .5s;
}
.stats-box {
  display: none;
  margin-left: 40px;
}

.leads-box {
  margin-top: 0.5rem;
  box-shadow: 1px 1px 15px 1px rgb(177, 174, 174);
}

.stats-title {
  font-size: 0.9rem;
}



.info-container-box div {
  color: white !important;
  border-radius: 10px;
  background: linear-gradient(72.47deg, #7367f0 22.16%, rgba(115, 103, 240, 0.7) 76.47%);  border-radius: 4px;
  margin-top: 10px;
  margin-left: 15px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}


@media (max-width: 736px) {
  .center-console {
    margin-left: 0px;
  }
  
}
.leads-box .info-container-box div span:nth-child(2) {
  font-size: 15px;
}
.contact-box-container {
  height: auto;
}
.outer-contact-box {
  display: block;
}

.basic-detail-container {
  background: linear-gradient(72.47deg, #7367f0 22.16%, rgba(115, 103, 240, 0.7) 76.47%);  border-radius: 4px;
  border-radius: 5px;
  box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;}


select {
  height: 3rem;
  width: 100%;
  outline: none;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
  border: 1px solid rgb(158, 158, 158);
}

.campaings-input {
  height: auto;
  padding: 10px 10px 30px 10px;
  background-color: #e2dfdf;
  border-radius: 10px;
  box-shadow: 1px 1px 5px 1px rgb(177, 174, 174);
}

.campaings-inner-input {
  height: 20rem;
  overflow-y: scroll;
}

.campaings-inner-input::-webkit-scrollbar {
  display: none;
}

.contact-sources {
  background-color: #e2dfdf;
  border-radius: 10px;
  box-shadow: 1px 1px 5px 1px rgb(177, 174, 174);
}

.checkboxes-container div {
  padding: 5px 0px 5px 0px;
}
.checkboxes-container div input {
  height: 1.2rem;
  width: 1.2rem;
  margin-left: 20px;
}

.checkboxes-container div span {
  padding-left: 20px;
  font-size: 13px;
}

.feedback-container {
  padding-bottom: 10px;
}

.feedback-container div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: white;
  margin-top: 10px;
  padding: 5px;
  font-size: 15px;
  box-shadow: 1px 1px 5px 1px rgb(177, 174, 174);
}

.feedback-container div span {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  font-size: 13px;
}

.leads-by-tag {
  background-color: rgba(0, 128, 0, 0.596);
  height: 5rem;
  width: 8rem;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  margin-top: 2rem;
  margin-bottom: 2rem;
  font-size: 1.2rem;
  color: white;
}

.profile-basic-details {
  margin-top: 1rem;
  height: 450px;
  width: 100%;
  background-color: white;
  box-shadow: 0px 1px 2px 1px rgb(177, 176, 176);
}

.profile-basic-details > div {
  padding: 15px;
  position: relative;
}
.profile-basic-details > .basic:after {
  content: "";
  position: absolute;
  border-bottom: 1px solid black;
  width: 100%;
  bottom: 0;
  left: 0;
}

.input-container {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(2, 50%);
  grid-row-gap: 2rem;
}

.input-fields {
  position: relative;
}

.input-fields input {
  width: 100%;
  padding: 10px;
  border: 1px solid grey;
  border-radius: 5px;
  outline: none;
  transition: all 0.2s ease;
}

.input-fields span {
  position: absolute;
  left: 25px;
  top: 50%;
  font-size: 14px;
  transform: translate(0%, -50%);
  transition: all 0.5s;
}

.input-fields input:valid + span,
.input-fields input:focus + span {
  transform: translateY(-35px);
  background: #fffffffb;
  font-size: 13px;
}

.updtbtn {
  margin: 20px auto;
  display: flex;
  justify-self: center;
  padding: 8px 20px 8px 20px;
  background-color: rgb(69, 69, 180);
  color: white;
  outline: none;
  border: none;
  border-radius: 8px;
}

.profile-tax {
  margin-top: 2rem;
  height: 250px;
  width: 100%;
  background-color: white;
  box-shadow: 0px 1px 2px 1px rgb(177, 176, 176);
}

.profile-tax > span {
  padding: 10px;
  position: relative;
  display: block;
}

.profile-tax > span::after {
  content: "";
  position: absolute;
  border-bottom: 1px solid black;
  width: 100%;
  bottom: 0;
  left: 0%;
}

.report-box {
  position: absolute;
  right: -147.5%;
  top: 29%;
  display: none !important;
}

.camp-report {
  top: 68%;
}

.active {
  display: block !important;
}

.hidden {
  display: none;
}

/* FOR USER REPORT PAGE */

/* filter bar */
.filter-side-container {
  background-color: #e2dfdf;
  width: 13%;
  margin-top: 5px;
  border-radius: 5px;
  position: fixed;
  height: 90%;
}

.filter-title-section {
  display: flex;
  justify-content: space-between;
  padding: 10px 5px 0px 5px;
  align-items: center;
}

.filter-title-section span {
  font-size: 1.3rem;
}

.filter-buttons button {
  background-color: #e2dfdf;
  font-size: 14px;
  outline: none;
  border: 1px solid #b0aeb1;
  color: #7367f0;
  border-radius: 4px;
}

.date-users-container {
  height: auto;
  margin: 15px 5px 0px 5px;
}

.filter-date-range {
  height: auto;
  border-radius: 4px;
  background-color: white;
}

.filter-date-range div,
.users div {
  padding: 10px 5px 20px 5px;
}

.date-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.date-calendar input {
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-bottom: 1px solid black;
  width: 100%;
  text-align: center;
  outline: none;
}

.users {
  background-color: white;
  margin-top: 1rem;
  height: auto;
  border-radius: 4px;
  position: relative;
}

.users-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  position: -webkit-sticky;
  top: 0;
  background-color: white;
  z-index: 100;
}

.user-checkbox {
  height: 30rem;
  overflow-y: scroll;
}



.user-checkbox::-webkit-scrollbar {
  background: transparent;
  width: 5px;
}
.user-checkbox::-webkit-scrollbar-thumb {
  background-color: #e2dfdf;
}

.added-users .container {
  display: block;
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  font-size: 12px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin-bottom: 20px;
}

/* Hide the browser's default checkbox */
.campaignFilterTick input,
.added-users input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.added-users input {
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 50%;
  left: 0;
  height: 15px;
  width: 15px;
  transform: translate(0, -50%);
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.container:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.container input:checked ~ .checkmark {
  background-color: #f32183;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container .checkmark:after {
  left: 4px;
  top: 1px;
  width: 7px;
  height: 12px;
  border: solid rgb(255, 255, 255);
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.right-report-container {
  margin-left: 15rem;
  padding-top: 20px;
}

.call-stats-container {
  display: flex;
  gap: 20px;
}

.call-box {
  border: 1px solid #7367f0;
  width: 10rem;
  border-radius: 10px;
  font-size: 13px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.call-box span {
  padding: 10px 0px 10px 0px;
}

.call-title {
  border-bottom: 1px solid #7367f0;
  width: 100%;
}

.hourly-report-container {
  height: 50rem;
  width: 100%;
  padding: 20px;
}

.hourly-first-container {
  height: 15rem;
  width: 100%;
  background-color: white;
  border-radius: 4px;
  border-bottom: 1px solid black;
  box-shadow: 1px 1px 3px 2px rgba(0, 0, 0, 0.2);
}

.hourly-first-container .hourly-title {
  color: #7367f0;
  font-size: 0.9rem;
  position: relative;
  display: block;
  padding: 10px 0px 10px 0px;
}

.hourly-first-container .hourly-title::after {
  content: "";
  position: absolute;
  border-bottom: 1px solid black;
  width: 100%;
  bottom: 0;
  left: 0;
}

.hourly-second {
  margin-top: 2rem;
  width: 100%;
  display: flex;
  gap: 20px;
}

.hourly-second input {
  padding: 10px;
  font-size: 0.9rem;
  border: 1px solid rgb(226, 226, 226);
  border-radius: 5px;
}

.hourly-second select {
  border: 1px solid rgb(226, 226, 226);
  width: 12rem;
  border-radius: 5px;
}

.hourly-second button {
  background-color: white;
  outline: none;
  border: 1px solid rgb(226, 226, 226);
  border-radius: 5px;
  width: 5rem;
  height: 3rem;
  margin: 20px 0px 0px 0px;
}

.hourly-input-container {
  display: flex;
  border: none;
  justify-content: space-evenly;
  align-items: center;
  padding: 20px 0px 10px 0px;
}

.hourly-day-report {
  width: 50%;
}

a {
  text-decoration: none;
}

.hide-btn {
  font-size: 13px;
  padding-left: 65px;
}

/* for leadReportPage */

.leadReportMain {
  display: flex;
  margin-top: 1.2rem;
  gap: 20px;
}

.camp-lead-main-box {
  background-color: rgb(255, 255, 255);
  height: auto;
  width: 75%;
  box-shadow: 0 0 3px 0px grey;
  border-bottom: 1px solid black;
}

.camp-lead-main-box form {
  display: flex;
  justify-content: space-between;
  padding: 10px 15px 10px 15px;
  margin-top: 20px;
}

.camp-lead-main-box form select {
  width: 90%;
  border-radius: 4px;
  outline: none;
  border: 1px solid rgb(226, 226, 226);
}

.camp-lead-main-box form button {
  border: 1px solid rgb(226, 226, 226);
  background-color: transparent;
  width: 5rem;
  border-radius: 4px;
}

.campaign-status-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-top: 1.4rem;
}

.leads-status-cards {
  width: auto;
  background-color: white;
  box-shadow: 0 0 3px 0px grey;
  border-radius: 4px;
}

.leads-status-cards {
  padding: 10px 20px 10px 20px;
  border-bottom: 1px solid black;
}

.leads-status-cards i {
  padding: 15px;
  border-radius: 60%;
  margin-left: 20px;
  font-size: 1.1rem;
}

.iFirst {
  background-color: rgb(195, 235, 195);
}

.iSecond {
  background-color: rgb(219, 241, 248);
}

.iThird {
  background-color: rgb(252, 219, 224);
}

.iFourth {
  background-color: rgb(247, 247, 173);
}

.lead-connection-container {
  padding: 10px 20px 10px 20px;
  display: flex;
  margin-top: 2rem;
  margin-bottom: 2rem;
  gap: 20px;
}

.not-connected-container {
  box-shadow: 0 0 3px 0px grey;
  width: 50%;
  border-radius: 4px;
}

.not-connected-container .title {
  display: block;
  padding: 10px 0px 10px 0px;
  background-color: white;
  text-align: center;
}

.not-connect-stats {
  display: flex;
  background-color: #ebebeb;
  border-bottom: 1px solid black;

  border-radius: 4px;
}
.not-connect-stats div {
  width: 50%;
  text-align: center;
  display: flex;
  flex-direction: column;
  margin: 10px 0px 10px 0px;
  border-left: 1px solid rgb(177, 175, 175);
}

.not-connect-stats div span {
  padding: 10px 0px 10px 0px;
  font-size: 1.2rem;
}

.not-connect-stats div:nth-child(1) {
  border: none;
}

.not-connect-stats div span:nth-child(1) {
  font-size: 0.8rem;
}

.not-connect-stats div span:nth-child(2) {
  font-weight: 500;
  font-size: 1.5rem;
}

.lead-campaign-details {
  background-color: rgb(255, 255, 255);
  width: 25%;
  height: 18rem;
}

.no-datas {
  display: flex;
  justify-content: center;
  align-items: center;
}

.assigned-info-container p span:nth-child(1) {
  font-weight: 600;
  padding-left: 10px;
}
.assigned-info-container {
  display: block;
}

/* for campaignreport page */

#campaignReportMain {
  height: auto !important;
}

#campaignreport-filter {
  height: auto;
}

.campaignFilterTick {
  margin-bottom: 10px !important;
}

.campaign-report-table-container {
  padding-top: 10px;
  margin-top: 0px !important;
  min-height: 30rem !important;
}

/* for custom lead form */

.form-main-container {
  box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.3);
  margin-top: 5px;
}

/* for createCampaign Page */
.campaign__form--container {
  box-shadow: 0px 0px 1px 0px rgba(0, 0, 0, 0.4);
  height: 95vh;
  /* background-color: red; */
}

.campaign__form--container .page-row {
  padding: 20px 0px 20px 0px;
  border-bottom: 1px solid grey;
}
.page__nav--container {
  width: 100%;
  text-align: center;
}

.page-nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.basic-container {
  box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.4);
  margin: 1rem;
  border-radius: 10px;
  background-color: white;
}

.basic {
  border-bottom: 1px solid rgba(177, 177, 177, 0.76);
}

.lead-distribution-box {
  border: 1px solid rgba(175, 175, 175, 0.637);
  padding: 10px 10px 20px 10px;
}

.createcamp-btn-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.createcamp-btn-container .active {
  background-color: #7367f0;
  color: white;
}

.createcamp-btn-container .disable {
  background-color: #727272;
  color: white;
}

/* for manage users */
.user-table-container {
  height: 40rem !important;
}
.user-table {
  height: auto !important;
}

.popUp {
  position: absolute;
  z-index: 100;
  left: 50%;
  top: 50%;
  transform: translate(-10%, -50%);
}

.addUsertag {
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: white;
}
.userpop-main-container {
  position: absolute;
  background-color: white;
  top: 50%;
  left: 40%;
  height: 30rem !important;
  overflow-y: scroll !important;
  z-index: 100;
  width: 70%;
  transform: translate(-30%, -50%);
}

#row-btn {
  margin-left: 50px;
  margin-bottom: 10px;
}
/* for bootstrap */
.col-sm-2 {
  width: 15% !important;
}

.popUpParent {
  display: none;
}

.popUp-visible {
  display: block;
}

/* for contact search button */
.contact-search-btn {
  padding: 10px 60px;
  outline: none;
  border: none;
  border-radius: 20px;
  background-color: #7367f0;
  color: white;
  font-size: 14px;
  font-weight: 500;
}

/* for fonts size */
.fs-6 {
  font-size: 13px !important;
}

.table-parent {
  height: 40rem !important;
  overflow-y: scroll;
}

.table .data-table-parent {
  height: auto;
}

div.dt-buttons {
  float: right !important;
}
.dataTables_wrapper {
  background-color: white;
  margin-top: 30px;
  padding: 10px;
  font-size: 14px;
}

.dataTables_wrapper .dataTables_filter {
  margin-right: 10px !important;
}
.dataTables_wrapper thead {
  position: sticky !important;
  top: 0% !important;
  background-color: white;
  padding-top: 0 !important;
}

.dataTables_wrapper label {
  display: flex;
}

.dataTables_wrapper select {
  height: 1.8rem;
  width: 100%;
  outline: none;
  padding: 10px;
  border-radius: 10px;
  border: 1px solid rgb(158, 158, 158);
}
.back-btn {
  border: none;
  outline: none;
  padding: 2px 7px 2px 7px;
  border-radius: 50%;
  margin-top: 5px;
  background-color: #7367f0;
  color: white;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background-color: #7367f0 !important;
  color: white !important;
  border: none !important;
  outline: none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background: #7367f0 !important;
  color: white !important;
  border: none !important;
  outline: none !important;
}
/* for custom properties */

.custom-title {
  font-size: 13px;
  font-weight: 600;
  color: #7367f0;
}

.custom__contact-property-form {
  width: 100%;
  padding-top: 10px;
  height: auto;
}

.custom-pop-input {
  display: none;
}

.custom-inner-container {
  width: 50%;
  margin: 0 auto;
}

/* for upload contact form popup */
.contact-uploading-popUp {
  background-color: rgba(161, 161, 161, 0.555);
  position: absolute;
  height: 100vh;
  width: 100vw;
  top: 0;
  left: 0;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
}

.uploadPopParent {
  display: none;
}

.main-pop-parent-container {
  background-color: white;
  height: auto;
  width: 60rem;
}

.first__popUpForm {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  z-index: 1000;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  width: 60%;
}

.contact__upload--icon {
  margin-top: 3rem;
  font-size: 60px;
  color: #b385da;
  text-align: center;
}

.upload-file-tag {
  font-size: 16px;
  display: block;
  color: black;
}
.note-line {
  margin-top: 1rem;
  padding: 10px 20px;
  display: block;
  width: 70%;
  text-align: center;
  background-color: #727272;
  font-size: 1rem;
  color: #ffffff;
  margin: 0 auto;
}

.upload-icon-container {
  padding: 10px 20px;
  margin: 0 auto;
  display: block;
  width: 20%;
  text-align: center;
}

.upload-file-icon {
  font-size: 18px;
  color: rgb(118, 118, 180);
}

.upload-close-btn {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  padding: 10px 20px;
}

/* for second upload pop up */

.radio-camp .radio-btn {
  display: flex;
  /* justify-content: center; */
  align-items: center;
  gap: 10px;
}

.radio-btn input[type="radio"] {
  appearance: none;
  outline: 2px solid rgb(218, 52, 88);
  height: 12px;
  width: 12px;
  border-radius: 50%;
  outline-offset: 3px;
}
.radio-btn input[type="radio"]:checked {
  background-color: rgb(218, 52, 88);
}

.campaigns-selection-type {
  background-color: #c7c7c7;
  width: 95% !important;
  padding: 8px 5px;
  display: block;
  margin: 0 auto;
}

.upload-pop-select {
  width: 50%;
  border-radius: 5px;
  margin-top: 10px;
}

.upload-pop-back {
  background-color: #7367f0;
  color: white;
}
.upload-pop-back:hover {
  background-color: #7367f0;
  color: white;
}
.upload-pop-next,
.upload-pop-next1 {
  background-color: #7367f0;
  color: white;
}
.upload-pop-next:hover {
  background-color: #7367f0;
  color: white;
}
.popUpload1 {
  display: none;
  margin: 0 auto;
}
.popUpload2,
.popUpload3,
.popUpload4 {
  display: none;
}

.contact-selection-hidden {
  display: none;
}

.popDuplicate {
  border-top: 1px solid #7367f0;
  position: relative;
}

.duplicate__setting-title {
  position: absolute;
  text-align: center;
  font-size: 15px;
  color: #7367f0;
  top: -35%;
  left: 10%;
  font-weight: 700;
  background-color: white;
  width: 25%;
}

.duplicay-setting {
  padding-left: 20px;
}

.duplicay-setting div {
  display: flex;
  align-items: center;
  gap: 10px;
}

/* for select drop down */

.ss-main {
  height: 45px !important;
}

.ss-search {
  display: none !important;
}

.ss-content {
  height: auto !important;
}

.ss-content .ss-list .ss-option:not(.ss-disabled).ss-selected,
.ss-main .ss-values .ss-value,
.ss-content .ss-list .ss-option:hover {
  background-color: #7367f0 !important;
  color: white !important;
}

.ss-main .ss-values .ss-value {
  border-radius: 100px !important;
  padding: 0px 10px 0px 10px !important;
}

.ss-main .ss-values .ss-value .ss-value-text {
  font-size: 15px !important;
}

.addUser-dialog {
  width: 70% !important;
}

.addUserBtn {
  display: flex !important;
  justify-content: space-between !important;
  width: 100%;
}

.usersLeadBar {
  height: 10rem !important;
  overflow-y: scroll;
}

.innerBar {
  height: 25rem !important;
  /* overflow-y: scroll; */
}

.usersLeadBar::-webkit-scrollbar {
  display: none !important;
}
#userBar {
  height: 100% !important;
  /* overflow-y: scroll; */
}

.camp-sum-table {
  height: 10rem !important;
  overflow-y: scroll;
  margin-top: 1rem;
}


/* for login page */

.inner-login {
  width: 100%;
  height: 20rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.login-pass-container {
  position: relative;
}

.passToggleBtn {
  position: absolute;
  right: 3%;
  top: 51%;
  font-size: 15px;
}


/* CSS */
.button-30 {
  align-items: center;
  appearance: none;
  background: linear-gradient(72.47deg, #7367f0 22.16%, rgba(115, 103, 240, 0.7) 76.47%);
  border-radius: 4px;
  border-width: 0;
  box-shadow: rgba(45, 35, 66, 0.4) 0 2px 4px,rgba(45, 35, 66, 0.3) 0 7px 13px -3px,#D6D6E7 0 -3px 0 inset;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font-family: "JetBrains Mono",monospace;
  height: 35px;
  justify-content: center;
  line-height: 1;
  list-style: none;
  overflow: hidden;
  padding: 0 10px;
  transition: box-shadow .15s,transform .15s;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  white-space: nowrap;
  will-change: box-shadow,transform;
  font-size: 16px;
}

.button-30:focus {
  box-shadow: #D6D6E7 0 0 0 1.5px inset, rgba(45, 35, 66, 0.4) 0 2px 4px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #D6D6E7 0 -3px 0 inset;
}

.button-30:hover {
  box-shadow: rgba(45, 35, 66, 0.4) 0 4px 8px, rgba(45, 35, 66, 0.3) 0 7px 13px -3px, #D6D6E7 0 -3px 0 inset;
  transform: translateY(-2px);
  color: white;
}

.button-30:active {
  box-shadow: #D6D6E7 0 3px 7px inset;
  transform: translateY(2px);
}
.button-success{
  font-size: 12px;
  height: 30px;
  background: linear-gradient(102.1deg, rgb(48, 180, 48) 2.9%, rgb(40, 251, 60) 96.3%);
  color: white;
  border: none;
}
.button-danger{
  font-size: 12px;
  height: 30px;
  background: linear-gradient(102.2deg, rgb(250, 45, 66) 9.6%, rgb(245, 104, 104) 96.1%);
  color: white;
  border: none;
}
.dt-button {

  background: linear-gradient(72.47deg, #7367f0 22.16%, rgba(115, 103, 240, 0.7) 76.47%) !important;  
  border: none;
  color: white !important;
}