.buttons .btn.active {
  background-color: var(--btn-bg);
  color: var(--primary-color);
  border: 1px solid var(--btn-border);
}

.btn-outline-secondary {
  color: var(--primary-color);
  border: 1px solid var(--btn-border);
}

.input-group .btn-outline-secondary {
  background-color: var(--btn-bg);
  color: var(--primary-color);
  border: 1px solid var(--btn-border);
}

.custom-search-bar {
  display: flex;
  align-items: center;
  background-color: var(--nav-active) !important;
  color: var(--primary-color);
  border: 1px solid var(--btn-border);
  border-radius: var(--border-radius-6);
  padding: 5px 8px;
  width: 300px;
  border-radius: var(--border-radius-6);
  background-color: var(--nav-active) !important;
}

.search-box {
  flex: 1;
  background-color: transparent;
  border: none;
  outline: none;
  color: var(--primary-color);
  font-size: var(--font-size-14);
  width: 30%;
}

.search-icon,
.clear-icon {
  font-size: 18px;
  color: var(--primary-color);
  cursor: pointer;
}

.buttons .btn {
  color: var(--primary-color);
}

.noData {
  color: var(--primary-color);
  font-size: larger;
}