
.cp {
    cursor: pointer;
  }
  .card-element {
    background: var(--card-bg);
    border: 1px solid var(--light-border);
    border-radius: 6px;
    padding: 10px 15px;

    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: var(--text-black-1);
  }

  .card-element {
    background: var(--card-bg);
    border: 1px solid var(--light-border);
    border-radius: 6px;
    padding: 10px 15px;

    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    color: var(--text-black-1);
  }

  .select2-container--default .select2-selection--single,
    .select2-container--default .select2-selection--multiple,
     {
    border-radius: 6px;
    padding: 5px 15px;
    min-height: 40px;
    box-shadow: none !important;
    outline: none !important;
    border: 1px solid #2d2d2d33 !important;
    background: var(--field-bg) !important;
    color: var(--field-txt) !important;
    }
    .select2-container--default.select2-container--disabled .select2-selection--single{
    background-color: #eee !important;
    }

  .card-element p {
    font-weight: 500;
    font-size: 12px;
    line-height: 22px;
    color: var(--text-black-1);
    margin: 0px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .card-element p b {
    font-weight: 600;
  }

  .card-element i {
    font-size: 20px;
    /*padding-left: 137px;*/
  }

  .card-element.active {
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
  }
.filters-box {
    display: none;
    position: absolute;
    left: 0px;
    top: 60px;
    width: 30rem;
    border: 1px solid var(--light-border);
    z-index: 1001;
    }
    .filters-box-next {
    display: none;
    position: absolute;
    left: 0px;
    top: 60px;
    width: 30rem;
    border: 1px solid var(--light-border);
    z-index: 1001;
    }

    .filters-box.md {
    width: 50rem;
    z-index: 1045;
    }
    .filters-box-next.md {
    width: 50rem;
    z-index: 1045;
    }

    .site-card {
    background: white;
    box-shadow: 0px 4px 20px #00000054;
    border-radius: 8px;
    padding: 8px 15px;
    }

    .scard-header {
    padding: 16px 21px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    }

    /* .card-element{
        background: #ffffff;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: 10px 15px;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
    } */


i.icon-Filterby {
    left: 135px;
    right: auto;
    top: 13px;
}
/*.icon-Filterby:before {
    content: "\e90d";
}*/


.search-control-wrap i.icon-Filterby {
  left: auto;
  right: 20px;
}

/* Table */
/* Table Search and Filters */
.search-control-wrap {
  position: relative;
  width: 100%;
  max-width: 458px;
  background: var(--card-bg);
  border: 1px solid var(--date-clr-bt-txt);
  border-radius: 8px;
  margin-right: 15px;
  padding: 10px 48px 10px 35px;
}

.search-control-wrap i {
  position: absolute;
  left: 10px;
  margin-top: 2px;
  font-size: 20px;
  color: var(--text-black-1);
  cursor: pointer;
}

.db-chips-wrap {
    overflow-x: auto !important;
  }

.search-control-wrap i.icon-Filterby {
  left: auto;
  right: 20px;
}

.search-control-wrap input {
  width: 100%;
  background: none;
  box-shadow: none;
  outline: none;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 22px;
  color: var(--text-black-1);
}

.search-control-wrap input::placeholder {
  color: #c6c6c6;
}

/* DateRange Picker */
.daterangepicker .drp-selected,
.daterangepicker:after,
.daterangepicker:before {
  display: none !important;
}

.daterangepicker {
  padding: 15px 20px;
  color: var(--text-black-0) !important;
  background: var(--card-bg) !important;
  box-shadow: 0px 4px 20px var(--date-shadow-color) !important;
  border-radius: 8px;
  border: 1px solid #ffffff;
}

.daterangepicker .calendar-table {
  border: none;
  color: var(--text-black-0) !important;
  background: var(--card-bg) !important;
}

.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
  color: var(--text-black-0);
  background: var(--card-bg);
}

.daterangepicker td.available:hover,
.daterangepicker th.available:hover,
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker .ranges li:hover,
.daterangepicker .ranges li.active {
  background-color: var(--date-active-bg) !important;
  color: #ffffff;
}

.daterangepicker td.in-range {
  background-color: var(--date-in-range-bg);
  color: var(--date-in-range-txt);
}

.daterangepicker .drp-buttons .btn {
  font-size: 14px;
  padding: 10px 20px;
  box-shadow: none !important;
  outline: none !important;
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
  border-color: var(--date-clr-bt-txt);
}

/* Footer */
.daterangepicker .drp-buttons {
  border-top: none;
}

.btn-theme-dark,
.daterangepicker-primary {
  background-color: var(--date-pm-bt-bg) !important;
  border-color: var(--date-pm-bt-bg) !important;
  color: var(--date-pm-bt-txt) !important;
  box-shadow: none !important;
  outline: none !important;
}

.btn-theme-outline-dark,
.daterangepicker-clear {
  border-color: var(--date-clr-bt-txt);
  background-color: var(--date-clr-bt-bg);
  color: var(--date-clr-bt-txt) !important;
  box-shadow: none !important;
  outline: none !important;
}

.height-50 {
  height: 50px;
}