#filter-btn.active {
  border: 1px solid black !important;
}

.filter-holder {
  position: relative;
}

.filter-box-1 {
  display: none;
  position: absolute;
  right: 0px;
  top: 45px;
  border: 1px solid #e2e8f0;
  width: 200px;

  /* Shadow/lg */
  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08),
    0px 4px 6px -2px rgba(16, 24, 40, 0.03);
}

.filter-box-2 {
  display: none;
  position: absolute;
  position: absolute;
  right: 210px;
  top: 140px;
  border: 1px solid #e2e8f0;
  width: 200px;

  /* Shadow/lg */
  box-shadow: 0px 12px 16px -4px rgba(16, 24, 40, 0.08),
    0px 4px 6px -2px rgba(16, 24, 40, 0.03);
}

/* Date picker  ---------------- */
.ranges {
  padding: 12px 16px;
}

.ranges > ul > li {
  padding: 12px 16px !important;

  color: #333c37 !important;
  font-family: var(--font-primary) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  letter-spacing: -0.084px !important;
  border-radius: 123px !important;
}

.ranges ul li.active {
  border-radius: 123px !important;
  background: #f1fcf3 !important;
}

.ranges ul li.active {
  border-radius: 123px !important;
  background: #f1fcf3 !important;
}

li[data-range-key="Custom Range"] {
  border-radius: 123px !important;
}

.daterangepicker {
  right: 27px !important;
  border-radius: 12px !important;
}

/* Drp Left */
.drp-calendar {
  padding: 24px !important;
}

.drp-calendar .month {
  color: #333c37 !important;
  font-family: var(--font-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.144px !important;
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
  border: solid #5c7062 !important;
  border-width: 0 2px 2px 0 !important;
}

.drp-calendar .calendar-table thead th {
  /* background-color: red; */
  padding: 8px !important;
  color: #333c37 !important;
  font-family: var(--font-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.144px !important;
}

.daterangepicker td {
  /* color: #c2cdc4 !important; */
  font-family: var(--font-primary) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px;
  letter-spacing: -0.084px;
  padding: 4px !important;
}

.daterangepicker td.start-date:not(.in-range):not(.off) {
  border-radius: 123px !important;
  background: #208b3a !important;
  color: white !important;
}

.daterangepicker td.in-range:not(.off) {
  background: #f1fcf3 !important;
  color: #48594d !important;
}

.daterangepicker td.end-date:not(.off) {
  border-radius: 123px !important;
  background: #208b3a !important;
  color: white !important;
}

.drp-selected {
  display: none !important;
}

.cancelBtn {
  padding: 10px 16px !important;
  border-radius: 1234px !important;
  border: 1px solid #e1e6e2;

  color: #48594d !important;
  font-family: var(--font-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: -0.084px !important;
  background-color: transparent !important;
}

.applyBtn {
  padding: 10px 16px !important;
  border-radius: 1234px !important;
  border: 1px solid #e1e6e2;
  border-radius: 1234px;
  background: #208b3a !important;

  color: #fff !important;
  font-family: var(--font-primary) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: -0.084px !important;
}

/* Language dropdown */
.lang-dropdown {
  position: absolute;
  top: 30px;
  left: 0px;
  z-index: 1;
  width: max-content;
}